12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- import _extends from "@babel/runtime/helpers/esm/extends";
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
- import React from 'react';
- import createChainedFunction from './utils/createChainedFunction';
-
- function isTrivialHref(href) {
- return !href || href.trim() === '#';
- }
- /**
- * There are situations due to browser quirks or Bootstrap CSS where
- * an anchor tag is needed, when semantically a button tag is the
- * better choice. SafeAnchor ensures that when an anchor is used like a
- * button its accessible. It also emulates input `disabled` behavior for
- * links, which is usually desirable for Buttons, NavItems, DropdownItems, etc.
- */
-
-
- var SafeAnchor = React.forwardRef(function (_ref, ref) {
- var _ref$as = _ref.as,
- Component = _ref$as === void 0 ? 'a' : _ref$as,
- disabled = _ref.disabled,
- onKeyDown = _ref.onKeyDown,
- props = _objectWithoutPropertiesLoose(_ref, ["as", "disabled", "onKeyDown"]);
-
- var handleClick = function handleClick(event) {
- var href = props.href,
- onClick = props.onClick;
-
- if (disabled || isTrivialHref(href)) {
- event.preventDefault();
- }
-
- if (disabled) {
- event.stopPropagation();
- return;
- }
-
- if (onClick) {
- onClick(event);
- }
- };
-
- var handleKeyDown = function handleKeyDown(event) {
- if (event.key === ' ') {
- event.preventDefault();
- handleClick(event);
- }
- };
-
- if (isTrivialHref(props.href)) {
- props.role = props.role || 'button'; // we want to make sure there is a href attribute on the node
- // otherwise, the cursor incorrectly styled (except with role='button')
-
- props.href = props.href || '#';
- }
-
- if (disabled) {
- props.tabIndex = -1;
- props['aria-disabled'] = true;
- }
-
- return React.createElement(Component, _extends({
- ref: ref
- }, props, {
- onClick: handleClick,
- onKeyDown: createChainedFunction(handleKeyDown, onKeyDown)
- }));
- });
- SafeAnchor.displayName = 'SafeAnchor';
- export default SafeAnchor;
|