@shopify/react-form-state/build/cjs/components/Nested.js

Manage React forms tersely and type-safely with no magic

'use strict';

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

var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
var React = require('react');
var utilities = require('../utilities.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

class Nested extends React__default['default'].PureComponent {
  constructor(...args) {
    super(...args);
    this.changeHandlers = new Map();

    this.handleChange = key => {
      if (this.changeHandlers.has(key)) {
        return this.changeHandlers.get(key);
      }

      const handler = newValue => {
        const {
          field: {
            onChange
          }
        } = this.props;
        onChange(value => {
          return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, value), {}, {
            [key]: typeof newValue === 'function' ? newValue(value[key]) : newValue
          });
        });
      };

      this.changeHandlers.set(key, handler);
      return handler;
    };
  }

  render() {
    const {
      field: {
        name,
        value,
        onBlur,
        initialValue,
        error
      },
      children
    } = this.props;
    const innerFields = utilities.mapObject(value, (value, fieldPath) => {
      const initialFieldValue = initialValue && initialValue[fieldPath];
      return {
        value,
        onBlur,
        name: `${name}.${fieldPath}`,
        initialValue: initialFieldValue,
        dirty: value !== initialFieldValue,
        error: error && error[fieldPath],
        onChange: this.handleChange(fieldPath)
      };
    });
    return children(innerFields);
  }

}

exports.default = Nested;