@themesberg/react-bootstrap
Version:
Unofficial release of the react-bootstrap library with Bootstrap 5 components built with React
55 lines (48 loc) • 2.07 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import React, { useContext } from 'react';
import classNames from 'classnames';
import AccordionContext from './AccordionContext';
import AccordionItemContext from './AccordionItemContext';
import { useBootstrapPrefix } from './ThemeProvider';
export function useAccordionButton(eventKey, onClick) {
var _useContext = useContext(AccordionContext),
activeEventKey = _useContext.activeEventKey,
onSelect = _useContext.onSelect;
return function (e) {
/*
Compare the event key in context with the given event key.
If they are the same, then collapse the component.
*/
var eventKeyPassed = eventKey === activeEventKey ? null : eventKey;
if (onSelect) onSelect(eventKeyPassed, e);
if (onClick) onClick(e);
};
}
var AccordionButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
var _ref$as = _ref.as,
Component = _ref$as === void 0 ? 'button' : _ref$as,
bsPrefix = _ref.bsPrefix,
className = _ref.className,
children = _ref.children,
onClick = _ref.onClick,
props = _objectWithoutPropertiesLoose(_ref, ["as", "bsPrefix", "className", "children", "onClick"]);
bsPrefix = useBootstrapPrefix(bsPrefix, 'accordion-button');
var _useContext2 = useContext(AccordionItemContext),
eventKey = _useContext2.eventKey;
var accordionOnClick = useAccordionButton(eventKey, onClick);
var _useContext3 = useContext(AccordionContext),
activeEventKey = _useContext3.activeEventKey;
if (Component === 'button') {
props.type = 'button';
}
return /*#__PURE__*/React.createElement(Component, _extends({
ref: ref,
onClick: accordionOnClick
}, props, {
"aria-expanded": eventKey === activeEventKey,
className: classNames(className, bsPrefix, eventKey !== activeEventKey && 'collapsed')
}), children);
});
AccordionButton.displayName = 'AccordionButton';
export default AccordionButton;