Page MenuHomec4science

DropdownItem.js
No OneTemporary

File Metadata

Created
Tue, Feb 4, 03:11

DropdownItem.js

const _excluded = ["eventKey", "disabled", "onClick", "active", "as"];
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
import * as React from 'react';
import { useContext } from 'react';
import useEventCallback from '@restart/hooks/useEventCallback';
import SelectableContext, { makeEventKey } from './SelectableContext';
import NavContext from './NavContext';
import Button from './Button';
import { dataAttr } from './DataKey';
import { jsx as _jsx } from "react/jsx-runtime";
/**
* Create a dropdown item. Returns a set of props for the dropdown item component
* including an `onClick` handler that prevents selection when the item is disabled
*/
export function useDropdownItem({
key,
href,
active,
disabled,
onClick
}) {
const onSelectCtx = useContext(SelectableContext);
const navContext = useContext(NavContext);
const {
activeKey
} = navContext || {};
const eventKey = makeEventKey(key, href);
const isActive = active == null && key != null ? makeEventKey(activeKey) === eventKey : active;
const handleClick = useEventCallback(event => {
if (disabled) return;
onClick == null ? void 0 : onClick(event);
if (onSelectCtx && !event.isPropagationStopped()) {
onSelectCtx(eventKey, event);
}
});
return [{
onClick: handleClick,
'aria-disabled': disabled || undefined,
'aria-selected': isActive,
[dataAttr('dropdown-item')]: ''
}, {
isActive
}];
}
const DropdownItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
let {
eventKey,
disabled,
onClick,
active,
as: Component = Button
} = _ref,
props = _objectWithoutPropertiesLoose(_ref, _excluded);
const [dropdownItemProps] = useDropdownItem({
key: eventKey,
href: props.href,
disabled,
onClick,
active
});
return /*#__PURE__*/_jsx(Component, Object.assign({}, props, {
ref: ref
}, dropdownItemProps));
});
DropdownItem.displayName = 'DropdownItem';
export default DropdownItem;

Event Timeline