Repository URL to install this package:
|
Version:
2.8.0-studio-release ▾
|
"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