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    
ui-component-library / dist / state / SelectionState.js
Size: Mime:
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
Object.defineProperty(exports, "__esModule", { value: true });
/**
 * @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 = exotic_1.EMPTY_ARRAY;
        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}`);
            }
            /**
             * onChange - (select list level)
             * onClick - item level
             */
            else if (exotic_1.isFunction(this.props.onChange)) {
                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);
    }
}
__decorate([
    mobx_1.observable.ref
], SelectionState.prototype, "list", void 0);
__decorate([
    mobx_1.observable
], SelectionState.prototype, "isVisible", void 0);
__decorate([
    mobx_1.action.bound
], SelectionState.prototype, "handleToggleVisibility", null);
__decorate([
    mobx_1.action
], SelectionState.prototype, "setIsVisible", null);
__decorate([
    mobx_1.action
], SelectionState.prototype, "selectItem", null);
__decorate([
    mobx_1.action.bound
], SelectionState.prototype, "unselectItem", null);
__decorate([
    mobx_1.action
], SelectionState.prototype, "unselectList", null);
__decorate([
    mobx_1.action.bound
], SelectionState.prototype, "decorateItem", null);
__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