@atlaskit/navigation-system
Version:
The latest navigation system for Atlassian apps.
29 lines • 1.37 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["iconButton", "icon", "label", "tooltip", "isTooltipDisabled"];
import React, { forwardRef } from 'react';
import { useIsCompactTopNav } from '../page-layout/top-nav/use-is-compact-top-nav';
/**
* An explicit responsive action: icon-only at xs/xxs, icon and label at sm and above.
* TopNav provides container measurements behind platform-dst-chat-panel-layout.
* Server markup uses an accessible icon-only fallback until client measurement.
* With the gate off or outside TopNav, it uses text. The button element is preserved.
*/
export var ResponsiveButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
var IconButtonComponent = _ref.iconButton,
icon = _ref.icon,
label = _ref.label,
tooltip = _ref.tooltip,
_ref$isTooltipDisable = _ref.isTooltipDisabled,
isTooltipDisabled = _ref$isTooltipDisable === void 0 ? false : _ref$isTooltipDisable,
props = _objectWithoutProperties(_ref, _excluded);
var isCompact = useIsCompactTopNav();
return /*#__PURE__*/React.createElement(IconButtonComponent, _extends({}, props, {
ref: ref,
icon: icon,
label: label,
shouldShowLabel: !isCompact,
isTooltipDisabled: isTooltipDisabled,
tooltip: tooltip
}));
});