@aspectus/vee-control-descriptor/dist/vee-control-descriptor.common.js

Control descriptor integrated with vee validate provider. Special wrapper for control element that adds additional description.

/*!
 * vee-control-descriptor v0.10.17 
 * (c) 2020 Alex Tkachenko
 * Released under the MIT License.
 */
'use strict';

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

var vueUtils = require('@aspectus/vue-utils');
var vueControlDescriptor = require('@aspectus/vue-control-descriptor');
var veeValidate = require('vee-validate');
var vueControlInteractionStateController = require('@aspectus/vue-control-interaction-state-controller');

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 _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;
}

var InteractionHideErrorsController = vueUtils.makeF(function (h, context) {
  var _context$props = context.props,
      descriptorComponent = _context$props.descriptorComponent,
      providerContext = _context$props.providerContext,
      errors = _context$props.errors,
      value = _context$props.value;

  var _context$data$on = context.data.on,
      input = _context$data$on.input,
      focus = _context$data$on.focus,
      blur = _context$data$on.blur,
      listeners = _objectWithoutProperties(_context$data$on, ["input", "focus", "blur"]);

  var baseHandlers = {
    input: input,
    focus: focus,
    blur: blur
  }; // Problems with undefined vue event handlers? Remove them.

  Object.keys(baseHandlers).forEach(function (key) {
    if (typeof baseHandlers[key] === 'undefined') {
      delete baseHandlers[key];
    }
  });
  return h(vueControlInteractionStateController.InteractionStateController, {
    // HACK: Tricky hack for vee-validate provider v-model-detection
    attrs: {
      value: value
    },
    on: baseHandlers,
    scopedSlots: {
      default: function _default(_ref) {
        var changing = _ref.changing,
            interacted = _ref.interacted,
            interacting = _ref.interacting,
            handlers = _ref.handlers;
        var definition = vueUtils.mergeContext(context.data, {
          attrs: {
            value: value,
            'provider-context': providerContext,
            errors: !providerContext.pending && (!interacting || interacting && !changing) && (interacted || providerContext.touched) ? errors : []
          }
        });
        definition.on = Object.assign({}, handlers, listeners);
        return h(descriptorComponent, definition, context.children);
      }
    }
  }, null);
}, {
  descriptorComponent: {},
  providerContext: {},
  errors: {},
  value: {}
}, 'vee-control-descriptor-controller-interaction-hide-errors');

/* eslint-disable prefer-object-spread */
var Gate = {
  render: function render(h) {
    var context = {
      attrs: Object.assign({
        value: this.value
      }, this.$attrs),
      on: Object.assign({}, this.$listeners, {
        input: this.input,
        blur: this.blur
      }),
      scopedSlots: this.$scopedSlots
    };
    return h(this.gatedHandlerComponent, context, null);
  },
  methods: {
    input: function input(e) {
      this.$emit('input', e);
    },
    blur: function blur(e) {
      this.$emit('blur', e);
    }
  },
  inheritAttrs: false,
  props: {
    gatedHandlerComponent: {},
    value: {}
  },
  name: 'vee-validate-input-handler-gate'
};

/* eslint-disable object-property-newline */
var Descriptor = {
  name: 'vee-control-descriptor',
  functional: true,
  props: {
    descriptorComponent: {
      default: function _default() {
        return vueControlDescriptor.ControlDescriptor;
      }
    },
    providerComponent: {
      default: function _default() {
        return veeValidate.ValidationProvider;
      }
    },
    controllerComponent: {
      default: function _default() {
        return InteractionHideErrorsController;
      }
    },
    disabled: Boolean,
    required: Boolean,
    readonly: Boolean,
    bails: Boolean,
    immediate: Boolean,
    debounce: Number,
    mode: {},
    customMessages: {},
    name: String,
    vid: {},
    value: {},
    rules: {}
  },
  render: function render(h, context) {
    var _context$props = context.props,
        descriptorComponent = _context$props.descriptorComponent,
        providerComponent = _context$props.providerComponent,
        controllerComponent = _context$props.controllerComponent,
        disabled = _context$props.disabled,
        required = _context$props.required,
        readonly = _context$props.readonly,
        bails = _context$props.bails,
        immediate = _context$props.immediate,
        debounce = _context$props.debounce,
        mode = _context$props.mode,
        customMessages = _context$props.customMessages,
        name = _context$props.name,
        vid = _context$props.vid,
        value = _context$props.value,
        rules = _context$props.rules;
    return h(providerComponent, {
      props: {
        disabled: disabled,
        required: required,
        readonly: readonly,
        bails: bails,
        immediate: immediate,
        debounce: debounce,
        mode: mode,
        customMessages: customMessages,
        name: name,
        vid: vid,
        value: value,
        skipIfEmpty: !required,
        rules: readonly ? '' : rules,
        slim: true
      },
      scopedSlots: {
        default: function _default(props) {
          var data = vueUtils.mergeContext(context.data, {
            attrs: {
              disabled: disabled,
              readonly: readonly,
              name: name,
              vid: vid,
              value: value,
              rules: rules,
              required: required || props.required,
              errors: props.errors,
              'provider-context': props,
              'descriptor-component': descriptorComponent,
              'gated-handler-component': controllerComponent
            }
          }); // FIXME: This gate mechanics unfortunately does not fix the
          // constant handlers amount increase issue.

          return h(Gate, data, context.children);
        }
      }
    });
  }
};

var NoneController = vueUtils.makeF(function (h, context) {
  return h(context.props.descriptorComponent, context.data, context.children);
}, {
  descriptorComponent: {}
}, 'vee-control-descriptor-controller-none');

function install(Vue) {
  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
      _ref$name = _ref.name,
      name = _ref$name === void 0 ? Descriptor.name : _ref$name,
      _ref$noneControllerNa = _ref.noneControllerName,
      noneControllerName = _ref$noneControllerNa === void 0 ? NoneController.name : _ref$noneControllerNa,
      _ref$interactionHideE = _ref.interactionHideErrorsControllerName,
      interactionHideErrorsControllerName = _ref$interactionHideE === void 0 ? InteractionHideErrorsController.name : _ref$interactionHideE;

  Vue.component(name, Descriptor);
  Vue.component(noneControllerName, NoneController);
  Vue.component(interactionHideErrorsControllerName, InteractionHideErrorsController);
}
var main = {
  install: install
};

exports.Descriptor = Descriptor;
exports.InteractionHideErrorsController = InteractionHideErrorsController;
exports.NoneController = NoneController;
exports.default = main;
exports.install = install;