@sb1/ffe-buttons-react 14.0.0 → 14.0.4

package/es/InlineBaseButton.spec.js

@@ -0,0 +1,59 @@
+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); }
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import InlineBaseButton from './InlineBaseButton';
+var defaultProps = {
+  children: 'Click me'
+};
+
+var getWrapper = function getWrapper(props) {
+  return shallow( /*#__PURE__*/React.createElement(InlineBaseButton, _extends({}, defaultProps, props)));
+};
+
+describe('<InlineBaseButton />', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.exists()).toBe(true);
+  });
+  it('renders the correct classes', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.hasClass('ffe-inline-button')).toBe(true);
+    wrapper.setProps({
+      className: 'custom-class',
+      buttonType: 'tertiary'
+    });
+    expect(wrapper.hasClass('ffe-inline-button--tertiary')).toBe(true);
+    expect(wrapper.hasClass('custom-class')).toBe(true);
+  });
+  it('renders the correct label', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.text()).toBe('Click me');
+    wrapper.setProps({
+      children: 'Press me'
+    });
+    expect(wrapper.text()).toBe('Press me');
+  });
+  it('renders left icon if set', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.find('.ffe-inline-button__icon--left').exists()).toBe(false);
+    wrapper.setProps({
+      leftIcon: /*#__PURE__*/React.createElement("svg", null)
+    });
+    expect(wrapper.find('.ffe-inline-button__icon--left').exists()).toBe(true);
+  });
+  it('renders right icon if set', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.find('.ffe-inline-button__icon--right').exists()).toBe(false);
+    wrapper.setProps({
+      rightIcon: /*#__PURE__*/React.createElement("svg", null)
+    });
+    expect(wrapper.find('.ffe-inline-button__icon--right').exists()).toBe(true);
+  });
+  it('renders the specified dom node', function () {
+    var wrapper = getWrapper({
+      element: 'a'
+    });
+    expect(wrapper.is('a')).toBe(true);
+  });
+});

package/es/InlineExpandButton.js

@@ -0,0 +1,45 @@
+var _excluded = ["isExpanded"];
+
+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 { bool, func, node, oneOfType, object, shape } from 'prop-types';
+import ChevronIkon from '@sb1/ffe-icons-react/lib/chevron-ikon';
+import InlineButton from './InlineBaseButton';
+
+var InlineExpandButton = function InlineExpandButton(props) {
+  var isExpanded = props.isExpanded,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/React.createElement(InlineButton, _extends({
+    buttonType: "expand",
+    type: "button",
+    rightIcon: /*#__PURE__*/React.createElement(ChevronIkon, {
+      style: {
+        marginLeft: '8px',
+        transform: isExpanded ? 'rotateZ(180deg)' : 'none'
+      }
+    })
+  }, rest));
+};
+
+InlineExpandButton.propTypes = {
+  /** Text that should reflect the isExpanded state. */
+  children: node,
+
+  /** Ref-setting function, or ref created by useRef, passed to the button element */
+  innerRef: oneOfType([func, shape({
+    current: object
+  })]),
+
+  /** When true it will indicate the button is in its open state */
+  isExpanded: bool.isRequired,
+
+  /** Listen for clicks to toggle the isExpanded state. */
+  onClick: func.isRequired
+};
+export default InlineExpandButton;

package/es/InlineExpandButton.spec.js

@@ -0,0 +1,50 @@
+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); }
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import ChevronIkon from '@sb1/ffe-icons-react/lib/chevron-ikon';
+import InlineExpandButton from './InlineExpandButton';
+var defaultProps = {
+  children: 'Click me',
+  isExpanded: false,
+  onClick: function onClick(f) {
+    return f;
+  }
+};
+
+var getWrapper = function getWrapper(props) {
+  return shallow( /*#__PURE__*/React.createElement(InlineExpandButton, _extends({}, defaultProps, props)));
+};
+
+describe('<InlineExpandButton />', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('buttonType', 'expand');
+  });
+  it('passes on any prop', function () {
+    var wrapper = getWrapper({
+      'aria-label': 'some label'
+    });
+    expect(wrapper.props()).toHaveProperty('aria-label', 'some label');
+  });
+  it('sends a <ChevronIcon /> as a default rightIcon prop', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('rightIcon', /*#__PURE__*/React.createElement(ChevronIkon, {
+      style: {
+        marginLeft: '8px',
+        transform: 'none'
+      }
+    }));
+  });
+  it('sends an upside down <ChevronIcon /> as rightIcon if isExpanded prop is true', function () {
+    var wrapper = getWrapper({
+      isExpanded: true
+    });
+    expect(wrapper.props()).toHaveProperty('rightIcon', /*#__PURE__*/React.createElement(ChevronIkon, {
+      style: {
+        marginLeft: '8px',
+        transform: 'rotateZ(180deg)'
+      }
+    }));
+  });
+});

package/es/PrimaryButton.js

@@ -0,0 +1,46 @@
+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); }
+
+import React from 'react';
+import { bool, func, oneOfType, node, string, object, shape, elementType } from 'prop-types';
+import Button from './BaseButton';
+
+var PrimaryButton = function PrimaryButton(props) {
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    buttonType: "primary"
+  }, props));
+};
+
+PrimaryButton.propTypes = {
+  /** Aria label for loading indicator */
+  ariaLoadingMessage: string,
+
+  /** The button label */
+  children: node,
+
+  /** Extra class names */
+  className: string,
+
+  /** Condensed modifier. Use in condensed designs */
+  condensed: bool,
+
+  /** Disable a button in certain situations */
+  disabled: bool,
+
+  /** The rendered element, like an `<a />` or `<Link />` */
+  element: oneOfType([func, string, elementType]),
+
+  /** Ref-setting function, or ref created by useRef, passed to the button element */
+  innerRef: oneOfType([func, shape({
+    current: object
+  })]),
+
+  /** Shows a loader if true */
+  isLoading: bool,
+
+  /** Icon shown to the left of the label */
+  leftIcon: node,
+
+  /** Icon shown to the right of the label */
+  rightIcon: node
+};
+export default PrimaryButton;

package/es/PrimaryButton.spec.js

@@ -0,0 +1,25 @@
+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); }
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import PrimaryButton from './PrimaryButton';
+var defaultProps = {
+  children: 'Click me'
+};
+
+var getWrapper = function getWrapper(props) {
+  return shallow( /*#__PURE__*/React.createElement(PrimaryButton, _extends({}, defaultProps, props)));
+};
+
+describe('<PrimaryButton />', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('buttonType', 'primary');
+  });
+  it('passes on any prop', function () {
+    var wrapper = getWrapper({
+      'aria-label': 'some label'
+    });
+    expect(wrapper.props()).toHaveProperty('aria-label', 'some label');
+  });
+});

package/es/SecondaryButton.js

@@ -0,0 +1,46 @@
+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); }
+
+import React from 'react';
+import { bool, func, oneOfType, string, node, object, shape, elementType } from 'prop-types';
+import Button from './BaseButton';
+
+var SecondaryButton = function SecondaryButton(props) {
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    buttonType: "secondary"
+  }, props));
+};
+
+SecondaryButton.propTypes = {
+  /** Aria label for loading indicator */
+  ariaLoadingMessage: string,
+
+  /** The button label */
+  children: node,
+
+  /** Extra class names */
+  className: string,
+
+  /** Condensed modifier. Use in condensed designs */
+  condensed: bool,
+
+  /** Disable a button in certain situations */
+  disabled: bool,
+
+  /** The rendered element, like an `<a />` or `<Link />` */
+  element: oneOfType([func, string, elementType]),
+
+  /** Ref-setting function, or ref created by useRef, passed to the button element */
+  innerRef: oneOfType([func, shape({
+    current: object
+  })]),
+
+  /**  Shows a loader if true */
+  isLoading: bool,
+
+  /** Icon shown to the left of the label */
+  leftIcon: node,
+
+  /** Icon shown to the right of the label */
+  rightIcon: node
+};
+export default SecondaryButton;

package/es/SecondaryButton.spec.js

@@ -0,0 +1,25 @@
+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); }
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import SecondaryButton from './SecondaryButton';
+var defaultProps = {
+  children: 'Click me'
+};
+
+var getWrapper = function getWrapper(props) {
+  return shallow( /*#__PURE__*/React.createElement(SecondaryButton, _extends({}, defaultProps, props)));
+};
+
+describe('<SecondaryButton />', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('buttonType', 'secondary');
+  });
+  it('passes on any prop', function () {
+    var wrapper = getWrapper({
+      'aria-label': 'some label'
+    });
+    expect(wrapper.props()).toHaveProperty('aria-label', 'some label');
+  });
+});

package/es/ShortcutButton.js

@@ -0,0 +1,39 @@
+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); }
+
+import React from 'react';
+import { bool, func, node, string, oneOfType, object, shape, elementType } from 'prop-types';
+import ChevronIkon from '@sb1/ffe-icons-react/lib/chevron-ikon';
+import Button from './BaseButton';
+
+var ShortcutButton = function ShortcutButton(props) {
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    buttonType: "shortcut",
+    rightIcon: /*#__PURE__*/React.createElement(ChevronIkon, null)
+  }, props));
+};
+
+ShortcutButton.propTypes = {
+  /** The button label */
+  children: node,
+
+  /** Extra class names */
+  className: string,
+
+  /** Condensed modifier. Use in condensed designs */
+  condensed: bool,
+
+  /** Disable a button in certain situations */
+  disabled: bool,
+
+  /** The rendered element, like an `<a />` or `<Link />` */
+  element: oneOfType([func, string, elementType]),
+
+  /** Ref-setting function, or ref created by useRef, passed to the button element */
+  innerRef: oneOfType([func, shape({
+    current: object
+  })]),
+
+  /** Icon shown to the left of the label */
+  leftIcon: node
+};
+export default ShortcutButton;

package/es/ShortcutButton.spec.js

@@ -0,0 +1,30 @@
+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); }
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import ChevronIkon from '@sb1/ffe-icons-react/lib/chevron-ikon';
+import ShortcutButton from './ShortcutButton';
+var defaultProps = {
+  children: 'Click me'
+};
+
+var getWrapper = function getWrapper(props) {
+  return shallow( /*#__PURE__*/React.createElement(ShortcutButton, _extends({}, defaultProps, props)));
+};
+
+describe('<ShortcutButton />', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('buttonType', 'shortcut');
+  });
+  it('passes on any prop', function () {
+    var wrapper = getWrapper({
+      'aria-label': 'some label'
+    });
+    expect(wrapper.props()).toHaveProperty('aria-label', 'some label');
+  });
+  it('sends a <ChevronIcon /> as a default rightIcon prop', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('rightIcon', /*#__PURE__*/React.createElement(ChevronIkon, null));
+  });
+});

package/es/TaskButton.js

@@ -0,0 +1,47 @@
+var _excluded = ["icon"];
+
+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 { bool, func, node, string, oneOfType, object, shape, elementType } from 'prop-types';
+import Button from './BaseButton';
+
+var TaskButton = function TaskButton(_ref) {
+  var icon = _ref.icon,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    buttonType: "task",
+    leftIcon: icon
+  }, rest));
+};
+
+TaskButton.propTypes = {
+  /** The button label */
+  children: node,
+
+  /** Extra class names */
+  className: string,
+
+  /** Condensed modifier. Use in condensed designs */
+  condensed: bool,
+
+  /** Disable a button in certain situations */
+  disabled: bool,
+
+  /** The rendered element, like an `<a />` or `<Link />` */
+  element: oneOfType([func, string, elementType]),
+
+  /** Task icon, show to the left of the label */
+  icon: node.isRequired,
+
+  /** Ref-setting function, or ref created by useRef, passed to the button element */
+  innerRef: oneOfType([func, shape({
+    current: object
+  })])
+};
+export default TaskButton;

package/es/TaskButton.spec.js

@@ -0,0 +1,33 @@
+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); }
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import ChevronIkon from '@sb1/ffe-icons-react/lib/chevron-ikon';
+import TaskButton from './TaskButton';
+var defaultProps = {
+  children: 'Click me',
+  icon: /*#__PURE__*/React.createElement("svg", null)
+};
+
+var getWrapper = function getWrapper(props) {
+  return shallow( /*#__PURE__*/React.createElement(TaskButton, _extends({}, defaultProps, props)));
+};
+
+describe('<TaskButton />', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('buttonType', 'task');
+  });
+  it('passes on any prop', function () {
+    var wrapper = getWrapper({
+      'aria-label': 'some label'
+    });
+    expect(wrapper.props()).toHaveProperty('aria-label', 'some label');
+  });
+  it('sends icon prop on as leftIcon prop', function () {
+    var wrapper = getWrapper({
+      icon: /*#__PURE__*/React.createElement(ChevronIkon, null)
+    });
+    expect(wrapper.props()).toHaveProperty('leftIcon', /*#__PURE__*/React.createElement(ChevronIkon, null));
+  });
+});

package/es/TertiaryButton.js

@@ -0,0 +1,34 @@
+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); }
+
+import React from 'react';
+import { func, node, oneOfType, string, object, shape, elementType } from 'prop-types';
+import InlineButton from './InlineBaseButton';
+
+var TertiaryButton = function TertiaryButton(props) {
+  return /*#__PURE__*/React.createElement(InlineButton, _extends({
+    buttonType: "tertiary"
+  }, props));
+};
+
+TertiaryButton.propTypes = {
+  /** The button label */
+  children: node,
+
+  /** Extra class names */
+  className: string,
+
+  /** The rendered element, like an `<a />` or `<Link />` */
+  element: oneOfType([func, string, elementType]),
+
+  /** Ref-setting function, or ref created by useRef, passed to the button element */
+  innerRef: oneOfType([func, shape({
+    current: object
+  })]),
+
+  /** Icon shown to the left of the label */
+  leftIcon: node,
+
+  /** Icon shown to the right of the label */
+  rightIcon: node
+};
+export default TertiaryButton;

package/es/TertiaryButton.spec.js

@@ -0,0 +1,25 @@
+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); }
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import TertiaryButton from './TertiaryButton';
+var defaultProps = {
+  children: 'Click me'
+};
+
+var getWrapper = function getWrapper(props) {
+  return shallow( /*#__PURE__*/React.createElement(TertiaryButton, _extends({}, defaultProps, props)));
+};
+
+describe('TertiaryButton', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('buttonType', 'tertiary');
+  });
+  it('passes on any prop', function () {
+    var wrapper = getWrapper({
+      'aria-label': 'some label'
+    });
+    expect(wrapper.props()).toHaveProperty('aria-label', 'some label');
+  });
+});

package/es/index.js

@@ -0,0 +1,10 @@
+export { default as ActionButton } from './ActionButton';
+export { default as BackButton } from './BackButton';
+export { default as ButtonGroup } from './ButtonGroup';
+export { default as ExpandButton } from './ExpandButton';
+export { default as InlineExpandButton } from './InlineExpandButton';
+export { default as PrimaryButton } from './PrimaryButton';
+export { default as SecondaryButton } from './SecondaryButton';
+export { default as ShortcutButton } from './ShortcutButton';
+export { default as TaskButton } from './TaskButton';
+export { default as TertiaryButton } from './TertiaryButton';

package/lib/ActionButton.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ActionButton;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("prop-types");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _BaseButton = _interopRequireDefault(require("./BaseButton"));
+
+var _excluded = ["className", "ghost"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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; }
+
+function ActionButton(props) {
+  var className = props.className,
+      ghost = props.ghost,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/_react.default.createElement(_BaseButton.default, _extends({
+    buttonType: "action",
+    className: (0, _classnames.default)(className, {
+      'ffe-button--ghost': ghost
+    })
+  }, rest));
+}
+
+ActionButton.propTypes = {
+  /** Aria label for loading indicator */
+  ariaLoadingMessage: _propTypes.string,
+
+  /** The button label */
+  children: _propTypes.node,
+
+  /** Extra class names */
+  className: _propTypes.string,
+
+  /** Condensed modifier. Use in condensed designs */
+  condensed: _propTypes.bool,
+
+  /** Disable a button in certain situations */
+  disabled: _propTypes.bool,
+
+  /** The rendered element, like an `<a />` or `<Link />` */
+  element: (0, _propTypes.oneOfType)([_propTypes.func, _propTypes.string, _propTypes.elementType]),
+
+  /** Applies the ghost modifier if true. */
+  ghost: _propTypes.bool,
+
+  /** Ref-setting function, or ref created by useRef, passed to the button element */
+  innerRef: (0, _propTypes.oneOfType)([_propTypes.func, (0, _propTypes.shape)({
+    current: _propTypes.object
+  })]),
+
+  /** Shows a loader if true */
+  isLoading: _propTypes.bool,
+
+  /** Icon shown to the left of the label */
+  leftIcon: _propTypes.node,
+
+  /** Icon shown to the right of the label */
+  rightIcon: _propTypes.node
+};
+ActionButton.defaultProps = {
+  ghost: false
+};

package/lib/ActionButton.spec.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _enzyme = require("enzyme");
+
+var _ActionButton = _interopRequireDefault(require("./ActionButton"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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); }
+
+var defaultProps = {
+  children: 'Click me'
+};
+
+var getWrapper = function getWrapper(props) {
+  return (0, _enzyme.shallow)( /*#__PURE__*/_react.default.createElement(_ActionButton.default, _extends({}, defaultProps, props)));
+};
+
+describe('<ActionButton />', function () {
+  it('renders without exploding', function () {
+    var wrapper = getWrapper();
+    expect(wrapper.props()).toHaveProperty('buttonType', 'action');
+  });
+  it('passes on any prop', function () {
+    var wrapper = getWrapper({
+      'aria-label': 'some label'
+    });
+    expect(wrapper.props()).toHaveProperty('aria-label', 'some label');
+  });
+  it('sets correct class when ghost prop is true', function () {
+    var wrapper = getWrapper({
+      ghost: true
+    });
+    expect(wrapper.hasClass('ffe-button--ghost')).toBe(true);
+  });
+});