jobiqo-cl/lib/src/components/03-molecules/02-empty/index.js

[](https://circleci.com/gh/jobiqo/jobiqo-cl)

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var React = require('react');
var React__default = _interopDefault(React);
var styled = require('styled-components');
var styled__default = _interopDefault(styled);
var index = require('../../02-atoms/06-layout/01-alignment/01-align-center/index.js');

/**
 * @file index.tsx
 *
 * @fileoverview Renders and empty element. Normally insde of a box.
 */
const EmptyELementWrapper = styled__default.div `
  max-width: ${props => props.theme.emptyElement.maxWidth};
  text-align: center;
  margin: auto;
  padding: ${props => props.theme.emptyElement.padding};
  color: ${props => props.theme.emptyElement.textColor};
`;
const StyledIconWrap = styled__default.div `
  svg {
    min-height: 100px;
    width: auto;
    color: ${props => props.iconColor
    ? props.iconColor
    : props.theme
        ? props.theme.emptyElement.iconColor
        : 'gray2'};
    ${props => (props.iconWidth ? `height: ${props.iconWidth}` : ``)}
    ${props => (props.iconHeight ? `height: ${props.iconHeight}` : ``)}
  }
`;
/**
 * An empty element can be used to show any kind of empty state. Eithe for
 * resumes / companies but also empty dashboard states or other empty states of any kind.
 */
const EmptyElement = ({ children, icon, iconColor, iconWidth, iconHeight }) => {
    return (React__default.createElement(EmptyELementWrapper, null,
        React__default.createElement(index.default, null,
            React__default.createElement(StyledIconWrap, { iconColor: iconColor, iconWidth: iconWidth, iconHeight: iconHeight }, icon),
            children)));
};

exports.EmptyElement = EmptyElement;