@hipay/hipay-material-ui 2.3.1-rc2 → 2.3.1-rc4

package/HiForm/HiUploadInput.test.js

@@ -0,0 +1,148 @@
+import React from 'react';
+import { assert } from 'chai';
+import { spy } from 'sinon';
+import { createMount } from '../test-utils';
+import HiUploadInput from './HiUploadInput';
+import HiIconButton from '../HiIconButton';
+describe('<HiUploadInput />', function () {
+  var mount;
+  var fakePdf;
+  var seeFile;
+  before(function () {
+    fakePdf = {
+      name: 'fakefile.pdf',
+      size: 32,
+      type: 'application/pdf'
+    };
+    seeFile = true;
+  });
+  beforeEach(function () {
+    mount = createMount();
+  });
+  afterEach(function () {
+    mount.cleanUp();
+  });
+  it('should render an <input> with type file inside a <label> inside a <div>', function () {
+    var defaultPlaceholder = 'default placeholder';
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      placeholder: defaultPlaceholder
+    }));
+    var label = wrapper.find('label');
+    assert.strictEqual(label.name(), 'label', 'should render a label');
+    assert.strictEqual(label.text(), defaultPlaceholder, 'should be the placeholder passed in props');
+    var input = label.find('input');
+    assert.strictEqual(input.name(), 'input', 'should contain an input');
+    assert.strictEqual(input.prop('type'), 'file', 'should be a file input');
+  });
+  it('should not show the clear and see buttons when no value is given', function () {
+    var wrapper = mount(React.createElement(HiUploadInput, null));
+    assert.strictEqual(wrapper.find(HiIconButton).length, 0, 'should not have icons');
+  });
+  it('should show the clear and see buttons when a value is given', function () {
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      value: fakePdf,
+      seeFile: seeFile
+    }));
+    assert.strictEqual(wrapper.find(HiIconButton).length, 2, 'should have the clear and see icons');
+  });
+  it('should show the clear button when a value is given', function () {
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      value: fakePdf
+    }));
+    assert.strictEqual(wrapper.find(HiIconButton).length, 1, 'should have the clear icon');
+  });
+  it('should fire onChange event callbacks', function () {
+    var handleChange = spy();
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      onChange: handleChange,
+      index: 1
+    }));
+    wrapper.find('input').simulate('change', {
+      target: {
+        files: [fakePdf]
+      }
+    });
+    assert.strictEqual(handleChange.calledOnce, true, 'should have been called once.');
+    assert.strictEqual(handleChange.calledWith({
+      errorMessage: '',
+      error: false,
+      value: fakePdf
+    }, 1), true, 'should have been called with the fakePdf file.');
+  });
+  it('should fire onDeleteFile event callbacks', function () {
+    var handleDeleteFile = spy();
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      onDeleteFile: handleDeleteFile,
+      value: fakePdf,
+      index: 1
+    }));
+    wrapper.find(HiIconButton).at(0).simulate('click');
+    assert.strictEqual(handleDeleteFile.calledOnce, true, 'should have been called once.');
+    assert.strictEqual(handleDeleteFile.calledWith(1), true, 'should have been called with the index of this HiUploadInput.');
+  });
+  it('should fire onSee event callbacks', function () {
+    var handleSee = spy();
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      onSeeFile: handleSee,
+      value: fakePdf,
+      index: 1,
+      seeFile: seeFile
+    }));
+    wrapper.find(HiIconButton).at(0).simulate('click');
+    assert.strictEqual(handleSee.calledOnce, true, 'should have been called once.');
+    assert.strictEqual(handleSee.calledWith(fakePdf), true, 'should have been called with the file to see.');
+  });
+  it('should fire onChange event callbacks with a size error', function () {
+    var handleChange = spy();
+    var translations = {
+      errorSize: 'error size'
+    };
+    var fakeLargeFile = {
+      name: 'fakelargefile.pdf',
+      size: 4096,
+      type: 'application/pdf'
+    };
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      onChange: handleChange,
+      value: fakeLargeFile,
+      maxSize: 2048,
+      index: 1,
+      translations: translations
+    }));
+    wrapper.find('input').simulate('change', {
+      target: {
+        files: [fakeLargeFile]
+      }
+    });
+    assert.strictEqual(handleChange.calledOnce, true, 'should have been called once.');
+    assert.strictEqual(handleChange.calledWith({
+      errorMessage: translations.errorSize,
+      error: true,
+      value: fakeLargeFile
+    }, 1), true, 'should be on error with errorSize message');
+  });
+  it('should fire onChange event callbacks with a type error', function () {
+    var handleChange = spy();
+    var translations = {
+      errorType: 'error type'
+    };
+    var wrapper = mount(React.createElement(HiUploadInput, {
+      onChange: handleChange,
+      value: fakePdf,
+      acceptedTypes: ['image/jpeg', 'video/mp4'],
+      index: 1,
+      translations: translations
+    }));
+    wrapper.find('input').simulate('change', {
+      target: {
+        files: [fakePdf]
+      }
+    });
+    assert.strictEqual(handleChange.calledOnce, true, 'should have been called once.');
+    assert.strictEqual(handleChange.calledWith({
+      errorMessage: translations.errorType,
+      error: true,
+      value: fakePdf
+    }, 1), true, 'should be on error with errorType message');
+  });
+});

package/HiForm/index.js

@@ -1,95 +1,11 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "HiAddressField", {
-  enumerable: true,
-  get: function get() {
-    return _HiAddressField.default;
-  }
-});
-Object.defineProperty(exports, "HiEmailField", {
-  enumerable: true,
-  get: function get() {
-    return _HiEmailField.default;
-  }
-});
-Object.defineProperty(exports, "HiFormControl", {
-  enumerable: true,
-  get: function get() {
-    return _HiFormControl.default;
-  }
-});
-Object.defineProperty(exports, "HiFormLabel", {
-  enumerable: true,
-  get: function get() {
-    return _HiFormLabel.default;
-  }
-});
-Object.defineProperty(exports, "HiInput", {
-  enumerable: true,
-  get: function get() {
-    return _HiInput.default;
-  }
-});
-Object.defineProperty(exports, "HiPasswordField", {
-  enumerable: true,
-  get: function get() {
-    return _HiPasswordField.default;
-  }
-});
-Object.defineProperty(exports, "HiSearchField", {
-  enumerable: true,
-  get: function get() {
-    return _HiSearchField.default;
-  }
-});
-Object.defineProperty(exports, "HiSlider", {
-  enumerable: true,
-  get: function get() {
-    return _HiSlider.default;
-  }
-});
-Object.defineProperty(exports, "HiTextField", {
-  enumerable: true,
-  get: function get() {
-    return _HiTextField.default;
-  }
-});
-Object.defineProperty(exports, "HiUpload", {
-  enumerable: true,
-  get: function get() {
-    return _HiUpload.default;
-  }
-});
-Object.defineProperty(exports, "HiUploadField", {
-  enumerable: true,
-  get: function get() {
-    return _HiUploadField.default;
-  }
-});
-
-var _HiAddressField = _interopRequireDefault(require("./HiAddressField"));
-
-var _HiEmailField = _interopRequireDefault(require("./HiEmailField"));
-
-var _HiFormControl = _interopRequireDefault(require("./HiFormControl"));
-
-var _HiFormLabel = _interopRequireDefault(require("./HiFormLabel"));
-
-var _HiInput = _interopRequireDefault(require("./HiInput"));
-
-var _HiPasswordField = _interopRequireDefault(require("./HiPasswordField"));
-
-var _HiSearchField = _interopRequireDefault(require("./HiSearchField"));
-
-var _HiSlider = _interopRequireDefault(require("./HiSlider"));
-
-var _HiTextField = _interopRequireDefault(require("./HiTextField"));
-
-var _HiUpload = _interopRequireDefault(require("./HiUpload"));
-
-var _HiUploadField = _interopRequireDefault(require("./HiUploadField"));
+export { default as HiAddressField } from './HiAddressField';
+export { default as HiEmailField } from './HiEmailField';
+export { default as HiFormControl } from './HiFormControl';
+export { default as HiFormLabel } from './HiFormLabel';
+export { default as HiInput } from './HiInput';
+export { default as HiPasswordField } from './HiPasswordField';
+export { default as HiSearchField } from './HiSearchField';
+export { default as HiSlider } from './HiSlider';
+export { default as HiTextField } from './HiTextField';
+export { default as HiUpload } from './HiUpload';
+export { default as HiUploadField } from './HiUploadField';

package/HiIcon/HiIcon.js

@@ -1,33 +1,12 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.useStyles = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _Icon = _interopRequireDefault(require("@material-ui/core/Icon"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _helpers = require("../utils/helpers");
-
-var hiSvgIcons = _interopRequireWildcard(require("../hi-svg-icons"));
-
-var mdi = _interopRequireWildcard(require("mdi-material-ui"));
-
-var useStyles = (0, _styles.makeStyles)(function (theme) {
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import React from 'react';
+import classNames from 'classnames';
+import Icon from '@material-ui/core/Icon';
+import { makeStyles, useTheme } from '@material-ui/core/styles';
+import { camelize, capitalize } from '../utils/helpers';
+import * as hiSvgIcons from '../hi-svg-icons';
+import * as mdi from 'mdi-material-ui';
+export var useStyles = makeStyles(function (theme) {
   return {
     /* Styles applied to the root element. */
     root: {
@@ -44,7 +23,6 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
     }
   };
 });
-exports.useStyles = useStyles;
 
 function HiIcon(props) {
   var children = props.children,
@@ -52,15 +30,16 @@ function HiIcon(props) {
       icon = props.icon,
       size = props.size,
       _color = props.color,
-      other = (0, _objectWithoutProperties2.default)(props, ["children", "className", "icon", "size", "color"]);
+      other = _objectWithoutProperties(props, ["children", "className", "icon", "size", "color"]);
+
   var classes = useStyles(props);
   var iconName = icon !== null ? icon : children;
-  var theme = (0, _styles.useTheme)();
+  var theme = useTheme();
   var color = ['primary', 'secondary', 'neutral', 'positive', 'middle', 'negative'].includes(_color) ? theme.palette[_color].main : _color; // Line Awesome icons
 
   if (iconName && iconName.indexOf('fa-') === 0) {
-    return _react.default.createElement("i", (0, _extends2.default)({
-      className: (0, _classnames.default)('fa', iconName, className, classes.root),
+    return React.createElement("i", Object.assign({
+      className: classNames('fa', iconName, className, classes.root),
       style: {
         fontSize: size
       }
@@ -69,9 +48,9 @@ function HiIcon(props) {
 
 
   if (iconName && iconName.indexOf('hi_') === 0) {
-    var IconName = hiSvgIcons[(0, _helpers.capitalize)((0, _helpers.camelize)(iconName))];
-    return _react.default.createElement(IconName, (0, _extends2.default)({
-      className: (0, _classnames.default)(classes.root, className),
+    var IconName = hiSvgIcons[capitalize(camelize(iconName))];
+    return React.createElement(IconName, Object.assign({
+      className: classNames(classes.root, className),
       color: color,
       size: size
     }, other));
@@ -85,8 +64,8 @@ function HiIcon(props) {
 
 
   if (iconName && iconName.indexOf('mdi_') === 0) {
-    var _IconName = mdi[(0, _helpers.capitalize)((0, _helpers.camelize)(iconName.slice(4)))];
-    return _react.default.createElement(_IconName, (0, _extends2.default)({
+    var _IconName = mdi[capitalize(camelize(iconName.slice(4)))];
+    return React.createElement(_IconName, Object.assign({
       color: color,
       style: {
         fontSize: size
@@ -95,8 +74,8 @@ function HiIcon(props) {
   } // @material-ui/icons
 
 
-  return _react.default.createElement(_Icon.default, (0, _extends2.default)({
-    className: (0, _classnames.default)(classes.root, className),
+  return React.createElement(Icon, Object.assign({
+    className: classNames(classes.root, className),
     color: color,
     style: {
       fontSize: size
@@ -109,5 +88,4 @@ HiIcon.defaultProps = {
   icon: null,
   size: 20
 };
-var _default = HiIcon;
-exports.default = _default;
+export default HiIcon;

package/HiIcon/index.js

@@ -1,15 +1 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _HiIcon.default;
-  }
-});
-
-var _HiIcon = _interopRequireDefault(require("./HiIcon"));
+export { default } from './HiIcon';

package/HiIconButton/HiIconButton.js

@@ -1,36 +1,18 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.styles = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _colorManipulator = require("@material-ui/core/styles/colorManipulator");
-
-var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
-
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 // @inheritedComponent IconButton
-var styles = function styles(theme) {
+import React from 'react';
+import classNames from 'classnames';
+import { withStyles } from '@material-ui/core/styles';
+import { fade } from '@material-ui/core/styles/colorManipulator';
+import IconButton from '@material-ui/core/IconButton';
+export var styles = function styles(theme) {
   return {
     label: {},
     positive: {
       color: theme.palette.positive.main,
       '&:hover': {
-        backgroundColor: (0, _colorManipulator.fade)(theme.palette.positive.main, theme.palette.action.hoverOpacity),
+        backgroundColor: fade(theme.palette.positive.main, theme.palette.action.hoverOpacity),
         // Reset on touch devices, it doesn't add specificity
         '@media (hover: none)': {
           backgroundColor: 'transparent'
@@ -40,7 +22,7 @@ var styles = function styles(theme) {
     negative: {
       color: theme.palette.negative.main,
       '&:hover': {
-        backgroundColor: (0, _colorManipulator.fade)(theme.palette.negative.main, theme.palette.action.hoverOpacity),
+        backgroundColor: fade(theme.palette.negative.main, theme.palette.action.hoverOpacity),
         // Reset on touch devices, it doesn't add specificity
         '@media (hover: none)': {
           backgroundColor: 'transparent'
@@ -50,7 +32,7 @@ var styles = function styles(theme) {
     middle: {
       color: theme.palette.middle.main,
       '&:hover': {
-        backgroundColor: (0, _colorManipulator.fade)(theme.palette.middle.main, theme.palette.action.hoverOpacity),
+        backgroundColor: fade(theme.palette.middle.main, theme.palette.action.hoverOpacity),
         // Reset on touch devices, it doesn't add specificity
         '@media (hover: none)': {
           backgroundColor: 'transparent'
@@ -60,7 +42,7 @@ var styles = function styles(theme) {
     neutral: {
       color: theme.palette.neutral.main,
       '&:hover': {
-        backgroundColor: (0, _colorManipulator.fade)(theme.palette.neutral.main, theme.palette.action.hoverOpacity),
+        backgroundColor: fade(theme.palette.neutral.main, theme.palette.action.hoverOpacity),
         // Reset on touch devices, it doesn't add specificity
         '@media (hover: none)': {
           backgroundColor: 'transparent'
@@ -70,8 +52,6 @@ var styles = function styles(theme) {
   };
 };
 
-exports.styles = styles;
-
 function HiIconButton(props) {
   var _classNames;
 
@@ -79,10 +59,11 @@ function HiIconButton(props) {
       classes = props.classes,
       className = props.className,
       color = props.color,
-      other = (0, _objectWithoutProperties2.default)(props, ["children", "classes", "className", "color"]);
+      other = _objectWithoutProperties(props, ["children", "classes", "className", "color"]);
+
   var hcolor = ['positive', 'negative', 'middle', 'neutral'].includes(color) ? 'inherit' : color;
-  var buttonClassNames = (0, _classnames.default)((_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.positive, color === 'positive'), (0, _defineProperty2.default)(_classNames, classes.negative, color === 'negative'), (0, _defineProperty2.default)(_classNames, classes.middle, color === 'middle'), (0, _defineProperty2.default)(_classNames, classes.neutral, color === 'neutral'), _classNames));
-  return _react.default.createElement(_IconButton.default, (0, _extends2.default)({
+  var buttonClassNames = classNames((_classNames = {}, _defineProperty(_classNames, classes.positive, color === 'positive'), _defineProperty(_classNames, classes.negative, color === 'negative'), _defineProperty(_classNames, classes.middle, color === 'middle'), _defineProperty(_classNames, classes.neutral, color === 'neutral'), _classNames));
+  return React.createElement(IconButton, Object.assign({
     className: className,
     classes: {
       root: buttonClassNames,
@@ -95,10 +76,7 @@ function HiIconButton(props) {
 HiIconButton.defaultProps = {
   color: 'default'
 };
-
-var _default = (0, _styles.withStyles)(styles, {
+export default withStyles(styles, {
   hiComponent: true,
   name: 'HmuiHiIconButton'
-})(HiIconButton);
-
-exports.default = _default;
+})(HiIconButton);

package/HiIconButton/HiIconButton.test.js

@@ -0,0 +1,69 @@
+import React from 'react';
+import { assert } from 'chai';
+import { createShallow, createRender, getClasses } from '../test-utils';
+import HiIconButton from './HiIconButton';
+import IconButton from '@material-ui/core/IconButton';
+import classNames from 'classnames';
+describe('<HiIconButton />', function () {
+  var shallow;
+  var render;
+  var classes;
+  var buttonClasses = getClasses(React.createElement(IconButton, null, "Hello World"));
+  before(function () {
+    shallow = createShallow({
+      dive: true
+    });
+    render = createRender();
+    classes = getClasses(React.createElement(HiIconButton, null, "Hello World"));
+  });
+  it('should render a <IconButton> element', function () {
+    var wrapper = shallow(React.createElement(HiIconButton, null, "Hello World"));
+    assert.strictEqual(wrapper.find(IconButton).length, 1);
+  });
+  it('should render forward primary color prop to <IconButton> component', function () {
+    var wrapper = shallow(React.createElement(HiIconButton, {
+      color: "primary"
+    }, "Hello World"));
+    assert.strictEqual(wrapper.find(IconButton).dive().props().color, 'primary', 'should render with the button color inherit');
+    assert.strictEqual(wrapper.find(IconButton).dive().props().classes.root, classNames(buttonClasses.root));
+  });
+  it('should render with the positive classes and set color to inherit', function () {
+    var wrapper = shallow(React.createElement(HiIconButton, {
+      color: "positive"
+    }, "Hello World"));
+    assert.strictEqual(wrapper.find(IconButton).dive().props().color, 'inherit', 'should render with the button color inherit');
+    assert.strictEqual(wrapper.find(IconButton).dive().props().classes.root, classNames(buttonClasses.root, classes.positive));
+  });
+  it('should render with the negative classes and set color to inherit', function () {
+    var wrapper = shallow(React.createElement(HiIconButton, {
+      color: "negative"
+    }, "Hello World"));
+    assert.strictEqual(wrapper.find(IconButton).dive().props().color, 'inherit', 'should render with the button color inherit');
+    assert.strictEqual(wrapper.find(IconButton).dive().props().classes.root, classNames(buttonClasses.root, classes.negative));
+  });
+  it('should render with the middle classes and set color to inherit', function () {
+    var wrapper = shallow(React.createElement(HiIconButton, {
+      color: "middle"
+    }, "Hello World"));
+    assert.strictEqual(wrapper.find(IconButton).dive().props().color, 'inherit', 'should render with the button color inherit');
+    assert.strictEqual(wrapper.find(IconButton).dive().props().classes.root, classNames(buttonClasses.root, classes.middle));
+  });
+  it('should render with the neutral classes and set color to inherit', function () {
+    var wrapper = shallow(React.createElement(HiIconButton, {
+      color: "neutral"
+    }, "Hello World"));
+    assert.strictEqual(wrapper.find(IconButton).dive().props().color, 'inherit', 'should render with the button color inherit');
+    assert.strictEqual(wrapper.find(IconButton).dive().props().classes.root, classNames(buttonClasses.root, classes.neutral));
+  });
+  describe('server side', function () {
+    // Only run the test on node.
+    if (!/jsdom/.test(window.navigator.userAgent)) {
+      return;
+    }
+
+    it('should server side render', function () {
+      var markup = render(React.createElement(HiIconButton, null, "Hello World"));
+      assert.strictEqual(markup.text(), 'Hello World');
+    });
+  });
+});

package/HiIconButton/index.js

@@ -1,15 +1 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _HiIconButton.default;
-  }
-});
-
-var _HiIconButton = _interopRequireDefault(require("./HiIconButton"));
+export { default } from './HiIconButton';

package/HiLoader/HiLoader.js

@@ -1,19 +1,7 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _PropagateLoader = _interopRequireDefault(require("react-spinners/PropagateLoader"));
-
-var _styles = require("@material-ui/core/styles");
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import React from 'react';
+import PropagateLoader from 'react-spinners/PropagateLoader';
+import { withStyles } from '@material-ui/core/styles';
 
 function HiLoader(props) {
   var className = props.className,
@@ -21,15 +9,15 @@ function HiLoader(props) {
       size = props.size,
       theme = props.theme,
       style = props.style;
-  return _react.default.createElement("div", {
+  return React.createElement("div", {
     id: "hi-loader",
     className: className,
-    style: (0, _objectSpread2.default)({}, style, {
+    style: _objectSpread({}, style, {
       display: 'block',
       width: 1,
       height: 12
     })
-  }, _react.default.createElement(_PropagateLoader.default, {
+  }, React.createElement(PropagateLoader, {
     size: size,
     color: theme.palette[color].main
   }));
@@ -39,11 +27,8 @@ HiLoader.defaultProps = {
   size: 12,
   color: 'primary'
 };
-
-var _default = (0, _styles.withStyles)({}, {
+export default withStyles({}, {
   hiComponent: true,
   withTheme: true,
   name: 'HmuiHiLoader'
-})(HiLoader);
-
-exports.default = _default;
+})(HiLoader);

package/HiLoader/HiLoader.test.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { assert } from 'chai';
+import { createShallow } from '../test-utils';
+import HiLoader from './HiLoader';
+describe('<HiLoader />', function () {
+  var shallow;
+  before(function () {
+    shallow = createShallow({
+      dive: true
+    });
+  });
+  it('renders a functional hour & minute ListPicker', function () {
+    var wrapper = shallow(React.createElement(HiLoader, {
+      loading: true
+    }));
+    assert.strictEqual(wrapper.name(), 'div', 'should render a div');
+  });
+});

package/HiLoader/index.js

@@ -1,15 +1 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _HiLoader.default;
-  }
-});
-
-var _HiLoader = _interopRequireDefault(require("./HiLoader"));
+export { default } from './HiLoader';