@atlaskit/atlassian-navigation/dist/esm/components/AtlassianNavigation/index.js

A horizontal navigation component for Atlassian apps.

import _extends from "@babel/runtime/helpers/extends";
/**
 * @jsxRuntime classic
 * @jsx jsx
 */
import React from 'react';

// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { css, jsx } from '@emotion/react';
import { NavigationAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
import warnOnce from '@atlaskit/ds-lib/warn-once';
import { HORIZONTAL_GLOBAL_NAV_HEIGHT } from '../../common/constants';
import { defaultTheme, ThemeProvider } from '../../theme';
import { PrimaryItemsContainer } from '../PrimaryItemsContainer';
var containerStyles = css({
  display: 'flex',
  boxSizing: 'border-box',
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
  height: HORIZONTAL_GLOBAL_NAV_HEIGHT,
  position: 'relative',
  alignItems: 'center',
  justifyContent: 'space-between',
  flexShrink: 0,
  borderBlockEnd: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)"),
  paddingInlineEnd: "var(--ds-space-150, 12px)",
  paddingInlineStart: "var(--ds-space-150, 12px)"
});
var leftStyles = css({
  display: 'flex',
  minWidth: 0,
  height: 'inherit',
  alignItems: 'center',
  flexGrow: 1,
  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
  '& > *': {
    flexShrink: 0
  }
});
var rightStyles = css({
  display: 'flex',
  alignItems: 'center',
  flexShrink: 0,
  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
  '& > *': {
    flexShrink: 0,
    marginInlineEnd: "var(--ds-space-050, 4px)"
  }
});
var noRightMarginStyles = css({
  marginInlineEnd: 0
});
var analyticsData = {
  attributes: {
    navigationLayer: 'global'
  },
  componentName: 'atlassianNavigation'
};

/**
 * __Atlassian navigation__
 *
 * The horizontal navigation component for Atlassian products.
 *
 * - [Examples](https://atlassian.design/components/atlassian-navigation/examples)
 * - [Code](https://atlassian.design/components/atlassian-navigation/examples)
 *
 * @deprecated `@atlaskit/atlassian-navigation` is deprecated. Use `@atlaskit/navigation-system` instead.
 */
export var AtlassianNavigation = function AtlassianNavigation(props) {
  if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'CI') {
    warnOnce('@atlaskit/atlassian-navigation is deprecated. Use @atlaskit/navigation-system instead.');
  }
  var label = props.label,
    _props$primaryItems = props.primaryItems,
    primaryItems = _props$primaryItems === void 0 ? [] : _props$primaryItems,
    AppSwitcher = props.renderAppSwitcher,
    create = props.renderCreate,
    Help = props.renderHelp,
    Notifications = props.renderNotifications,
    ProductHome = props.renderProductHome,
    Profile = props.renderProfile,
    Search = props.renderSearch,
    SignIn = props.renderSignIn,
    Settings = props.renderSettings,
    _props$moreLabel = props.moreLabel,
    moreLabel = _props$moreLabel === void 0 ? '…' : _props$moreLabel,
    _props$theme = props.theme,
    theme = _props$theme === void 0 ? defaultTheme : _props$theme,
    testId = props.testId,
    _props$isServer = props.isServer,
    isServer = _props$isServer === void 0 ? false : _props$isServer,
    _props$isSSRPlacehold = props.isSSRPlaceholderEnabled,
    isSSRPlaceholderEnabled = _props$isSSRPlacehold === void 0 ? false : _props$isSSRPlacehold;
  return jsx(ThemeProvider, {
    value: theme
  }, jsx(NavigationAnalyticsContext, {
    data: analyticsData
  }, jsx("header", _extends({
    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
    style: theme.mode.navigation,
    css: containerStyles,
    "data-testid": testId && "".concat(testId, "-header"),
    role: "banner",
    "data-vc": "atlassian-navigation".concat(isServer ? '-ssr' : '')
  }, isServer && isSSRPlaceholderEnabled && {
    'data-ssr-placeholder': 'atlassian-navigation-placeholder'
  }, !isServer && isSSRPlaceholderEnabled && {
    'data-ssr-placeholder-replace': 'atlassian-navigation-placeholder'
  }), jsx("nav", {
    css: leftStyles,
    "aria-label": label
  }, AppSwitcher && jsx(AppSwitcher, null), ProductHome && jsx(ProductHome, null), jsx(PrimaryItemsContainer, {
    testId: testId,
    moreLabel: moreLabel,
    items: primaryItems,
    create: create
    // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
    ,
    theme: theme
  })), jsx("div", {
    css: rightStyles,
    "data-testid": testId && "".concat(testId, "-secondary-actions")
  }, Search && jsx(Search, null), jsx("div", {
    role: "list",
    css: [rightStyles, noRightMarginStyles],
    "data-vc": "atlassian-navigation-secondary-actions"
  }, Notifications && jsx(Notifications, null), Help && jsx(Help, null), Settings && jsx(Settings, null), SignIn && jsx(SignIn, null), Profile && jsx(Profile, null))))));
};