lucid-ui/lib/components/LoadingMessage/LoadingMessage.js

A UI component library from AppNexus.

import _isNull from "lodash/isNull";
import _keys from "lodash/keys";
import _get from "lodash/get";

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import React from 'react';
import PropTypes from 'react-peek/prop-types';
import { lucidClassNames } from '../../util/style-helpers';
import { getFirst, omitProps } from '../../util/component-types';
import LoadingIcon from '../Icon/LoadingIcon/LoadingIcon';
var cx = lucidClassNames.bind('&-LoadingMessage');
var any = PropTypes.any,
    node = PropTypes.node,
    string = PropTypes.string;

var LoadingMessageIcon = function LoadingMessageIcon(_props) {
  return null;
};

LoadingMessageIcon.displayName = 'LoadingMessage.Icon';
LoadingMessageIcon.peek = {
  description: "\n\t\tRenders the `Icon` element passed in\n\t"
};
LoadingMessageIcon.propName = 'Icon';
LoadingMessageIcon.propTypes = {
  description: string,
  children: any
};

var LoadingMessageTitle = function LoadingMessageTitle(_props) {
  return null;
};

LoadingMessageTitle.displayName = 'LoadingMessage.Title';
LoadingMessageTitle.peek = {
  description: "\n\t\tRenders an `<h3>` that represents the title of the\n\t\t`LoadingMessage`.  Defaults to the string \"Loading\".\n\t"
};
LoadingMessageTitle.propName = 'Title';
LoadingMessageTitle.propTypes = {
  description: string,
  children: any
};

var LoadingMessageBody = function LoadingMessageBody(_props) {
  return null;
};

LoadingMessageBody.displayName = 'LoadingMessage.Body';
LoadingMessageBody.peek = {
  description: "\n\t\tRenders an `<span>` that represents the body of the\n\t\t`LoadingMessage`.\n\t"
};
LoadingMessageBody.propName = 'Body';
LoadingMessageBody.propTypes = {
  description: string,
  children: any
};
export var LoadingMessage = function LoadingMessage(props) {
  var className = props.className,
      passThroughs = _objectWithoutProperties(props, ["className"]);

  var Icon = LoadingMessage.Icon,
      Title = LoadingMessage.Title,
      Body = LoadingMessage.Body;
  var defaultTitle = 'Loading';
  var iconElement = getFirst(props, Icon);

  var iconChildren = _get(iconElement, 'props.children', /*#__PURE__*/React.createElement(LoadingIcon, null));

  var titleElement = getFirst(props, Title);

  var titleChildren = _get(titleElement, 'props.children');

  var bodyElement = getFirst(props, Body);

  var bodyChildren = _get(bodyElement, 'props.children', null);

  return /*#__PURE__*/React.createElement("div", _extends({}, omitProps(passThroughs, undefined, _keys(LoadingMessage.propTypes)), {
    className: cx('&', {
      '&-no-content': _isNull(titleChildren) && !bodyChildren
    }, className)
  }), iconChildren, !_isNull(titleChildren) && /*#__PURE__*/React.createElement("h3", {
    className: cx('&-title')
  }, titleChildren || defaultTitle), bodyChildren && /*#__PURE__*/React.createElement("span", {
    className: cx('&-body')
  }, bodyChildren));
};
LoadingMessage.Icon = LoadingMessageIcon;
LoadingMessage.Title = LoadingMessageTitle;
LoadingMessage.Body = LoadingMessageBody;
LoadingMessage._isPrivate = true;
LoadingMessage.displayName = 'LoadingMessage';
LoadingMessage.peek = {
  description: "\n\t\tA loading message.\n\t",
  categories: ['communication'],
  madeFrom: ['LoadingIcon']
};
LoadingMessage.propTypes = {
  className: string,
  children: node,
  Icon: node,
  Title: node,
  Body: node
};
export default LoadingMessage;