Dashboard sipadu mbip
Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

SafeAnchor.js 2.0KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
  3. import React from 'react';
  4. import createChainedFunction from './utils/createChainedFunction';
  5. function isTrivialHref(href) {
  6. return !href || href.trim() === '#';
  7. }
  8. /**
  9. * There are situations due to browser quirks or Bootstrap CSS where
  10. * an anchor tag is needed, when semantically a button tag is the
  11. * better choice. SafeAnchor ensures that when an anchor is used like a
  12. * button its accessible. It also emulates input `disabled` behavior for
  13. * links, which is usually desirable for Buttons, NavItems, DropdownItems, etc.
  14. */
  15. var SafeAnchor = React.forwardRef(function (_ref, ref) {
  16. var _ref$as = _ref.as,
  17. Component = _ref$as === void 0 ? 'a' : _ref$as,
  18. disabled = _ref.disabled,
  19. onKeyDown = _ref.onKeyDown,
  20. props = _objectWithoutPropertiesLoose(_ref, ["as", "disabled", "onKeyDown"]);
  21. var handleClick = function handleClick(event) {
  22. var href = props.href,
  23. onClick = props.onClick;
  24. if (disabled || isTrivialHref(href)) {
  25. event.preventDefault();
  26. }
  27. if (disabled) {
  28. event.stopPropagation();
  29. return;
  30. }
  31. if (onClick) {
  32. onClick(event);
  33. }
  34. };
  35. var handleKeyDown = function handleKeyDown(event) {
  36. if (event.key === ' ') {
  37. event.preventDefault();
  38. handleClick(event);
  39. }
  40. };
  41. if (isTrivialHref(props.href)) {
  42. props.role = props.role || 'button'; // we want to make sure there is a href attribute on the node
  43. // otherwise, the cursor incorrectly styled (except with role='button')
  44. props.href = props.href || '#';
  45. }
  46. if (disabled) {
  47. props.tabIndex = -1;
  48. props['aria-disabled'] = true;
  49. }
  50. return React.createElement(Component, _extends({
  51. ref: ref
  52. }, props, {
  53. onClick: handleClick,
  54. onKeyDown: createChainedFunction(handleKeyDown, onKeyDown)
  55. }));
  56. });
  57. SafeAnchor.displayName = 'SafeAnchor';
  58. export default SafeAnchor;