@atlaskit/atlassian-navigation
Version:
A horizontal navigation component for Atlassian apps.
80 lines (79 loc) • 2.98 kB
JavaScript
/* index.tsx generated by @compiled/babel-plugin v0.39.1 */
import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["badge", "component", "href", "id", "isDisabled", "isSelected", "label", "onBlur", "onClick", "onFocus", "onMouseDown", "onMouseEnter", "onMouseLeave", "onMouseUp", "target", "testId", "tooltip"];
import "./index.compiled.css";
import { ax, ix } from "@compiled/react/runtime";
import React, { forwardRef } from 'react';
import QuestionCircleIcon from '@atlaskit/icon/core/question-circle';
import { Flex } from '@atlaskit/primitives/compiled';
import { BadgeContainer } from '../BadgeContainer';
import { IconButton } from '../IconButton';
var iconSpacingStyles = {
space050: "_1rjc1b66 _18zr1b66"
};
var HELP_NOTIFICATION_BADGE_ID = 'atlassian-navigation-help-notification-count';
/**
* __Help__
*
* A help button that can be passed into `AtlassianNavigation`'s `renderHelp` prop.
*
* - [Examples](https://atlassian.design/components/atlassian-navigation/examples#help)
* - [Code](https://atlassian.design/components/atlassian-navigation/code)
*
* @deprecated `@atlaskit/atlassian-navigation` is deprecated. Use `@atlaskit/navigation-system` instead.
*/
export var Help = /*#__PURE__*/forwardRef(function (props, ref) {
var badge = props.badge,
component = props.component,
href = props.href,
id = props.id,
isDisabled = props.isDisabled,
isSelected = props.isSelected,
label = props.label,
onBlur = props.onBlur,
onClick = props.onClick,
onFocus = props.onFocus,
onMouseDown = props.onMouseDown,
onMouseEnter = props.onMouseEnter,
onMouseLeave = props.onMouseLeave,
onMouseUp = props.onMouseUp,
target = props.target,
testId = props.testId,
tooltip = props.tooltip,
rest = _objectWithoutProperties(props, _excluded);
var button = /*#__PURE__*/React.createElement(IconButton, _extends({
component: component,
href: href,
icon: /*#__PURE__*/React.createElement(Flex, {
xcss: iconSpacingStyles.space050
}, /*#__PURE__*/React.createElement(QuestionCircleIcon, {
label: typeof tooltip === 'string' ? tooltip : 'Help Icon',
color: "currentColor"
})),
id: id,
isDisabled: isDisabled,
isSelected: isSelected,
label: label,
onBlur: onBlur,
onClick: onClick,
onFocus: onFocus,
onMouseDown: onMouseDown,
onMouseEnter: onMouseEnter,
onMouseLeave: onMouseLeave,
onMouseUp: onMouseUp,
ref: ref,
target: target,
testId: testId,
tooltip: tooltip,
isTooltipAnnouncementDisabled: true
// These are all explicit, leaving it in just in case
}, rest));
return badge ? /*#__PURE__*/React.createElement(BadgeContainer, {
id: HELP_NOTIFICATION_BADGE_ID,
badge: badge,
role: "listitem"
}, button) : /*#__PURE__*/React.createElement("div", {
role: "listitem"
}, button);
});