Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
@skava/ui / dist / forms / input / InputState.js
Size: Mime:
"use strict";

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

const tslib_1 = require("tslib");

const exotic_1 = require("exotic");

const mobx_1 = require("xmobx/mobx");

const deps_1 = require("../deps");

const deps_2 = require("./deps");

const typings_1 = require("./typings");

const fixture_1 = require("./fixture");
/**
 * @todo use mobx actions
 * @todo - onValueChange, keyboard navigation, plugins...
 */


class InputState extends typings_1.InputStateType {
  constructor(stateData = {}) {
    // shouldn't need this super call...
    super(); // @observable className = undefined
    // @observable value: InputValue = ''
    // @observable isEnabled = true
    // @observable isFocused = false
    // @observable isSelected = false
    // @observable type = 'text'
    // @observable elementList = []
    // @observable error: undefined | Error = undefined
    // @observable isValidInput = true

    this.isVisible = true;
    this.isInputState = true;
    /**
     * @todo should be computed eh...
     */

    this.getValue = () => {
      // @todo and radio, it should return value?
      if (fixture_1.toggleTypes.includes(this.type)) {
        return this.isSelected;
      }

      return this.value;
    }; // setEnabled


    this.disable = () => {
      this.isEnabled = false;
    };

    this.enable = () => {
      this.isEnabled = true;
    }; // setValidity


    this.invalid = () => {
      this.isValid = false;
    }; // setValidity


    this.valid = () => {
      this.isValid = true;
    };

    this.select = () => {
      this.isSelected = true;
    };

    this.unselect = () => {
      this.isSelected = false;
    };

    this.setIsSelected = isSelected => {
      this.isSelected = isSelected;
    };
    /**
     * @description should not really be used - if ever used, as a last resort
     * @type {IAction}
     * @modifies this.input
     */


    this.setInputReference = dom => {
      this.input = dom;
    };
    /**
     * @todo !!!!!!!!!!!!!!! REMOVE - THIS MAKES EVERYTHING OBSERVABLE @@PERF
     */


    console.warn('!!!!!!!!!!!!!!! REMOVE - THIS MAKES EVERYTHING OBSERVABLE @@PERF');
    mobx_1.extendObservable(this, Object.assign({}, fixture_1.types)); // @note - this loops through to dynamically take all props
    // this is bad because it takes tooo many properties

    this.from(stateData);
  }

  static init(data) {
    return new InputState(data);
  }
  /**
   * loop through keys, set props
   * @see chain.from
   */


  from(obj = {}) {
    // we can replace a whole object
    // that replacement can be observable
    const dynamic = {};

    const set = (key, value) => {
      const should = deps_2.shouldRemap(key);

      if (should === false) {
        deps_2.unknown(key, value);
      }

      if (key === 'identifier') {
        this._identifier = value; // this.identity = this.identity || value

        this.identity = value;
        return;
      } // regardless


      dynamic[key] = value; // === this will not update ===

      this[key] = value;
    };

    const onKey = key => {
      const value = obj[key];

      if (deps_2.hasType(key) === true) {
        this[key] = value;
      } else {
        set(key, value);
      }
    };

    Object.keys(obj).forEach(onKey); // update

    this.dynamicState = dynamic;
    return this;
  }
  /**
   * @todo @name setIsFocused
   */


  updateFocused(event, instance) {
    if (!event || event.target.value === '') {
      this.isFocused = !this.isFocused;
    }
  }
  /**
   * @note @todo @fixme - this is why we do actions to set the data
   */


  validateInput() {
    this.setIsValidInput(deps_1.isValid(this.value, this.validationType));
    this.errorMessage = deps_1.errorMessage(this.errorMessageFor);
  }

  setValue(value) {
    console.log('setting_value', {
      selfValue: this.value,
      value,
      self: this
    });

    if (fixture_1.toggleTypes.includes(this.type)) {
      this.isSelected = exotic_1.toBoolean(value);
      return;
    }

    this.value = value || '';
  }

  setValidationType(validationType) {
    this.validationType = validationType || '';
  }

  setType(type) {
    this.type = type;
  }

  setIsValidInput(value) {
    this.isValidInput = value;
  }

  get identifier() {
    return this._identifier || this.identity || this.name || '@@empty';
  }

  setIsVisible(isVisible) {
    this.isVisible = isVisible;
  }
  /**
   * @description to put props into container
   */


  setProps(props) {
    console.log('input state setprops', props);
    this.props = props;
  } // ========= protected read =========

  /**
   * @variation radio [name] for when it's a radio, because there is only one with the same name
   * @variation toggle/checkbox .isSelected
   * @variation text/textarea/other .value
   */


  toJSON() {
    const key = this.name || this.identity;
    const serialized = {
      [key]: this.value || this.isSelected
    };
    /**
     * @todo @fixme bad serialization - fixed in ui-component-library
     */

    if (serialized['0'] === key) {
      delete serialized['0'];
    }
    /**
     * @todo @@perf put in in env, remove, use new form flow
     */


    if (exotic_1.isArray(this.elementList) && this.elementList.length > 0) {
      const serializedChildren = exotic_1.isArray(this.elementList) && this.elementList.length > 0 && JSON.stringify(this.elementList);
      console.warn('can serialize children !!! ', serializedChildren);
    }

    return serialized;
  }

  toString() {
    return JSON.stringify(this.toJSON(), undefined, 2);
  }

}

InputState.types = fixture_1.types;

tslib_1.__decorate([mobx_1.observable], InputState.prototype, "isVisible", void 0);

tslib_1.__decorate([mobx_1.action], InputState.prototype, "from", null);

tslib_1.__decorate([mobx_1.action.bound], InputState.prototype, "updateFocused", null);

tslib_1.__decorate([mobx_1.action.bound], InputState.prototype, "validateInput", null);

tslib_1.__decorate([mobx_1.action.bound], InputState.prototype, "setValue", null);

tslib_1.__decorate([mobx_1.action], InputState.prototype, "setValidationType", null);

tslib_1.__decorate([mobx_1.action], InputState.prototype, "setType", null);

tslib_1.__decorate([mobx_1.action], InputState.prototype, "setIsValidInput", null);

tslib_1.__decorate([mobx_1.action.bound], InputState.prototype, "setIsSelected", void 0);

tslib_1.__decorate([mobx_1.action], InputState.prototype, "setIsVisible", null);

tslib_1.__decorate([mobx_1.action.bound], InputState.prototype, "setProps", null);

exports.InputState = InputState;
exports.default = InputState; //# sourceMappingURL=InputState.js.map