@coreui/react/dist/esm/components/dropdown/CDropdownToggle.js

UI Components Library for React.js

import { __rest, __assign } from '../../node_modules/tslib/tslib.es6.js';
import React, { useContext } from 'react';
import PropTypes from 'prop-types';
import classNames from '../../_virtual/index.js';
import { CButton } from '../button/CButton.js';
import { CDropdownContext } from './CDropdownContext.js';
import { triggerPropType } from '../../props.js';

var CDropdownToggle = function (_a) {
    var children = _a.children, _b = _a.caret, caret = _b === void 0 ? true : _b, custom = _a.custom, className = _a.className, _c = _a.navLink, navLink = _c === void 0 ? true : _c, split = _a.split, _d = _a.trigger, trigger = _d === void 0 ? 'click' : _d, rest = __rest(_a, ["children", "caret", "custom", "className", "navLink", "split", "trigger"]);
    var _e = useContext(CDropdownContext), dropdownToggleRef = _e.dropdownToggleRef, variant = _e.variant, visible = _e.visible, setVisible = _e.setVisible;
    var triggers = __assign(__assign({}, ((trigger === 'click' || trigger.includes('click')) && {
        onClick: function (event) {
            event.preventDefault();
            setVisible(!visible);
        },
    })), ((trigger === 'focus' || trigger.includes('focus')) && {
        onFocus: function () { return setVisible(true); },
        onBlur: function () { return setVisible(false); },
    }));
    var togglerProps = __assign({ className: classNames({
            'nav-link': variant === 'nav-item' && navLink,
            'dropdown-toggle': caret,
            'dropdown-toggle-split': split,
            show: visible,
        }, className), 'aria-expanded': visible }, (!rest.disabled && __assign({}, triggers)));
    var Toggler = function () {
        if (custom && React.isValidElement(children)) {
            return (React.createElement(React.Fragment, null, React.cloneElement(children, __assign(__assign({ 'aria-expanded': visible }, (!rest.disabled && __assign({}, triggers))), { ref: dropdownToggleRef }))));
        }
        if (variant === 'nav-item' && navLink) {
            return (React.createElement("a", __assign({ href: "#" }, togglerProps, { role: "button" }, rest, { ref: dropdownToggleRef }), children));
        }
        return (React.createElement(CButton, __assign({}, togglerProps, { tabIndex: 0 }, rest, { ref: dropdownToggleRef }),
            children,
            split && React.createElement("span", { className: "visually-hidden" }, "Toggle Dropdown")));
    };
    return React.createElement(Toggler, null);
};
CDropdownToggle.propTypes = {
    caret: PropTypes.bool,
    children: PropTypes.node,
    className: PropTypes.string,
    custom: PropTypes.bool,
    split: PropTypes.bool,
    trigger: triggerPropType,
};
CDropdownToggle.displayName = 'CDropdownToggle';

export { CDropdownToggle };
//# sourceMappingURL=CDropdownToggle.js.map