@atlaskit/side-navigation/dist/esm/components/LoadingItems/index.js

A highly composable side navigation component that supports nested views.

/* index.tsx generated by @compiled/babel-plugin v3.0.2 */
import _extends from "@babel/runtime/helpers/extends";
import "./index.compiled.css";
import { ax, ix } from "@compiled/react/runtime";
import React from 'react';
import ExitingPersistence from '@atlaskit/motion/exiting-persistence';
import FadeIn from '@atlaskit/motion/fade-in';
import { useShouldNestedElementRender } from '../NestableNavigationContent/use-should-nested-element-render';

/**
 * @deprecated `@atlaskit/side-navigation` is deprecated. Use `@atlaskit/navigation-system` instead.
 */

var baseMotionStyles = null;
var enteringStyles = null;

/**
 * __Loading items__
 *
 * Loading items conditionally render based on the useShouldNestedElementRender() hook.
 *
 * @deprecated `@atlaskit/side-navigation` is deprecated. Use `@atlaskit/navigation-system` instead.
 */
export var LoadingItems = function LoadingItems(_ref) {
  var children = _ref.children,
    isLoading = _ref.isLoading,
    fallback = _ref.fallback,
    testId = _ref.testId;
  var _useShouldNestedEleme = useShouldNestedElementRender(),
    shouldRender = _useShouldNestedEleme.shouldRender;
  if (!shouldRender) {
    return children;
  }
  return /*#__PURE__*/React.createElement(ExitingPersistence, null, /*#__PURE__*/React.createElement(FadeIn, {
    key: "loading-section-".concat(isLoading),
    duration: "medium"
  }, function (motion, state) {
    return /*#__PURE__*/React.createElement("span", _extends({}, motion, {
      "data-testid": testId && "".concat(testId, "--").concat(state),
      className: ax(["_kqswstnw _1pbykb7n _154iidpf _1xi2idpf _1ltvidpf", state === 'entering' && "_kqswpfqs _1pbycs5v"])
    }), isLoading ? fallback : children);
  }));
};