Repository URL to install this package:
|
Version:
3.0.4 ▾
|
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const tslib_1 = require("tslib");
/**
* @todo find an optimized understandable way to mixin...
* also split this file probably
*/
const exotic_1 = require("exotic");
const mobx_1 = require("xmobx/mobx");
/**
* @todo belongs in deps...
*/
exports.isSatisfiedByIsSelected = item => item.isSelected;
/**
* props | props.list | props.options | []
*/
exports.toList = props => exotic_1.isArray(props) ? props : exotic_1.isArray(props.list) ? props.list : exotic_1.isArray(props.options) ? props.options : exotic_1.EMPTY_ARRAY;
/**
* optimizations...
*/
exports.isDecorated = item => exotic_1.isFunction(item.onClick) && item.onClick.isDecorated === true;
exports.isEveryItemInListDecoratedWithOnClick = props => exports.toList(props).every(exports.isDecorated);
/**
* This way we can provide the selction state in a list
*/
class SelectionState {
constructor() {
this.list = [];
this.isVisible = false;
this.props = exotic_1.EMPTY_OBJ; // yagni
// @action setList(list: SelectableList) { this.list = list }
// @action setProps(props: SelectableProps) { this.props = props }
}
/**
* @todo @name toggleIsVisible
*/
handleToggleVisibility() {
this.isVisible = !this.isVisible;
}
setIsVisible(isVisible) {
this.isVisible = isVisible;
}
/**
* This function selects the particular item
*/
selectItem(item) {
item.isSelected = true;
}
/**
* This function deSelects the item in the array list
*
* .bound because @see this.unselectList
*/
unselectItem(item) {
console.info('[SelectionState] unselecting item: ', item.label);
item.isSelected = false;
}
/**
* This function loops the items in the array list
*/
unselectList(list) {
console.info('[SelectionState] unselecting list: ', list.length);
list.forEach(this.unselectItem);
}
/**
* here we set properties on each item so we can handle each click
*/
decorateItem(item, index) {
console.debug('[SelectionState] decorateItem: ' + item.label);
if (exotic_1.isFunction(item.onClick)) {
/**
* we put .isDecorated on this so that we can call it multiple times
* & not double d
*/
if (item.onClick.isDecorated === true) {
console.debug(`[SelectionState] item is already decorated: ${item.label}`);
} else if (exotic_1.isFunction(this.props.onChange)) {
/**
* onChange - (select list level)
* onClick - item level
*/
console.warn(`[SelectionState] already had onClick ${item.label}`);
console.info(`[SelectionState] - adding a wrapper since we passed in onChange`); // ref
const itemOnClick = item.onClick; // wrap
const selectionStateItemOnClickWrappingExistingOnClick = event => {
console.info('[SelectionState] calling onChange + itemOnClick: ', item.label);
itemOnClick(event, item, this);
this.props.onChange(event, item, this);
};
item.onClick = mobx_1.action(selectionStateItemOnClickWrappingExistingOnClick);
} else {
console.warn(`[SelectionState] already had onClick ${item.label} and no "onChange" was passed in`);
}
} else {
const selectionStateItemOnClick = event => {
console.info('[SelectionState] selecting item: ', item.label);
this.unselectList(this.list);
this.selectItem(item);
if (exotic_1.isFunction(this.props.onChange)) {
console.info('[SelectionState] calling onChange: ', item.label); // @todo there is no real event, need to finish standardizing
this.props.onChange(event, item, this);
}
}; // for enforced actions
item.onClick = mobx_1.action(selectionStateItemOnClick);
} // added either way
item.onClick.isDecorated = true;
}
get selectedItem() {
// @todo Default Select Label || this.list[0]
return this.list.find(exports.isSatisfiedByIsSelected);
}
/**
* was named unSelectedListWithSelectedItem
*/
decorateWithProps(props) {
this.props = props; // @note - compat for skreact
this.list = exports.toList(this.props); // @note - we can see this without logs using mobx devtools
console.debug('[decorateWithProps]');
console.dir(this.list);
this.list.forEach(this.decorateItem);
}
}
tslib_1.__decorate([mobx_1.observable.ref], SelectionState.prototype, "list", void 0);
tslib_1.__decorate([mobx_1.observable], SelectionState.prototype, "isVisible", void 0);
tslib_1.__decorate([mobx_1.action.bound], SelectionState.prototype, "handleToggleVisibility", null);
tslib_1.__decorate([mobx_1.action.bound], SelectionState.prototype, "setIsVisible", null);
tslib_1.__decorate([mobx_1.action], SelectionState.prototype, "selectItem", null);
tslib_1.__decorate([mobx_1.action.bound], SelectionState.prototype, "unselectItem", null);
tslib_1.__decorate([mobx_1.action], SelectionState.prototype, "unselectList", null);
tslib_1.__decorate([mobx_1.action.bound], SelectionState.prototype, "decorateItem", null);
tslib_1.__decorate([mobx_1.action], SelectionState.prototype, "decorateWithProps", null);
exports.SelectionState = SelectionState;
function toSelectionState(props) {
const state = new SelectionState();
state.decorateWithProps(props);
return state;
}
exports.toSelectionState = toSelectionState;
exports.default = SelectionState; //# sourceMappingURL=SelectionState.js.map