@mindhive/documents/src/DocEdit.js

Standard document viewing, editing, listing etc

'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reduxForm = require('redux-form');

var _reactHotkeys = require('react-hotkeys');

var _recompose = require('recompose');

var _Overlay = require('material-ui/internal/Overlay');

var _Overlay2 = _interopRequireDefault(_Overlay);

var _List = require('material-ui/List');

var _Icon = require('@mindhive/components/Icon');

var _withStore = require('@mindhive/mobx/withStore');

var _withStore2 = _interopRequireDefault(_withStore);

var _EditStyles = require('./edit/EditStyles');

var _Buttons = require('./edit/Buttons');

var _Buttons2 = _interopRequireDefault(_Buttons);

var _EditDomain = require('./edit/EditDomain');

var _EditDomain2 = _interopRequireDefault(_EditDomain);

var _withDocEditContext = require('./withDocEditContext');

var _withDocEditContext2 = _interopRequireDefault(_withDocEditContext);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var lastFocusId = 'DOC_EDIT_LAST_FOCUS';

var DocEdit = function DocEdit(_ref) {
  var editDomain = _ref.editDomain,
      docType = _ref.docType,
      docIcon = _ref.docIcon,
      onCancel = _ref.onCancel,
      containerStyle = _ref.containerStyle,
      _ref$showIcon = _ref.showIcon,
      showIcon = _ref$showIcon === undefined ? false : _ref$showIcon,
      styles = _ref.styles,
      isNew = _ref.isNew,
      id = _ref.id,
      children = _ref.children,
      extraButtons = _ref.extraButtons,
      processing = _ref.processing,
      pristine = _ref.pristine,
      submitting = _ref.submitting,
      valid = _ref.valid,
      error = _ref.error,
      handleSubmit = _ref.handleSubmit;
  return _react2.default.createElement(
    _reactHotkeys.HotKeys,
    { keyMap: editDomain.keyMap, handlers: editDomain.handlers },
    _react2.default.createElement(_Overlay2.default, { autoLockScrolling: false, style: styles.overlay, show: isNew || !pristine }),
    _react2.default.createElement(
      _List.ListItem,
      {
        disableTouchRipple: true,
        disableFocusRipple: true,

        ref: editDomain.registerListItem,
        style: Object.assign({}, styles.container, containerStyle, editDomain.show ? styles.shown : styles.hidden),
        id: docType + '-list-item-' + (id || 'new') + '-selector',
        leftIcon: showIcon ? _react2.default.createElement(_Icon.Icon, { ligature: docIcon, style: styles.icon }) : null
      },
      error && _react2.default.createElement(
        'div',
        { style: styles.error },
        error.reason
      ),
      _react2.default.createElement(
        'form',
        {
          id: docType + '-form',
          onSubmit: handleSubmit
        },
        _react2.default.Children.map(children, function (child) {
          if (!child) {
            return child;
          }
          var isFirstFocus = child && child.props && child.props.autoFocus === true;
          var props = {};
          if (isFirstFocus) {
            props.ref = editDomain.registerFirstFocus;
            if (typeof child.type !== 'string') props.withRef = isFirstFocus;
          }
          return _react2.default.cloneElement(child, props);
        }),
        _react2.default.createElement(_Buttons2.default, {
          props: { isNew: isNew, docType: docType, extraButtons: extraButtons, processing: processing, pristine: pristine, submitting: submitting, valid: valid },
          closeTouchTap: function closeTouchTap() {
            return editDomain.handleClose(onCancel);
          },
          lastFocusId: lastFocusId
        })
      )
    )
  );
};

exports.default = (0, _recompose.compose)((0, _recompose.withProps)(function (_ref2) {
  var _ref2$document = _ref2.document,
      document = _ref2$document === undefined ? {} : _ref2$document,
      _ref2$docType = _ref2.docType,
      docType = _ref2$docType === undefined ? 'doc' : _ref2$docType,
      _ref2$id = _ref2.id,
      id = _ref2$id === undefined ? document._id : _ref2$id;
  return {
    document: document,
    docType: docType,
    isNew: !document._id,
    id: id,
    initialValues: document,
    form: docType + '-form-' + (id || 'new')
  };
}), (0, _reduxForm.reduxForm)(), (0, _withStore2.default)({
  storeClass: _EditDomain2.default,
  propName: 'editDomain'
}), (0, _recompose.lifecycle)({
  componentDidMount: function componentDidMount() {
    this.props.editDomain.componentDidMount();
  },
  componentWillUnmount: function componentWillUnmount() {
    this.props.editDomain.componentWillUnmount();
  }
}), _withDocEditContext2.default, _EditStyles.injectStylesSheet)(DocEdit);