@singularsystems/neo-react 1.0.0-alpha.2 → 1.0.0-beta.0

package/dist/ReactComponents/RadioList.js

@@ -1,77 +1,59 @@
-import { __decorate, __extends } from "tslib";
-import React from 'react';
-import { EnumHelper, Utils } from '@singularsystems/neo-core';
-import { observer } from 'mobx-react';
-import { BindPropsHelper } from './PropTypes';
-import ComponentBase from './ComponentBase';
-import { FormContext } from './FormContext';
-var RadioList = /** @class */ (function (_super) {
-    __extends(RadioList, _super);
-    function RadioList() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.items = [];
-        return _this;
-    }
-    RadioList.prototype.preRender = function () {
-        if (this.props.radioList.items && this.props.radioList.items !== this.previousList) {
-            this.previousList = this.props.radioList.items;
-            this.createEnumList(this.props.radioList.items);
-        }
-        else if (this.props.radioList.enumType && this.props.radioList.enumType !== this.previousEnumType) {
-            this.previousEnumType = this.props.radioList.enumType;
-            this.items = EnumHelper.asList(this.props.radioList.enumType);
-        }
-    };
-    RadioList.prototype.createEnumList = function (list) {
-        var _a, _b;
-        if (list.length) {
-            var valueMember_1 = (_a = this.props.radioList.valueMember) !== null && _a !== void 0 ? _a : "";
-            var displayMember_1 = (_b = this.props.radioList.displayMember) !== null && _b !== void 0 ? _b : "";
-            if (!displayMember_1) {
-                var neoTypeInfo = list[0].constructor.neo;
-                if (neoTypeInfo && neoTypeInfo.displayMember) {
-                    displayMember_1 = neoTypeInfo.displayMember.propertyName;
-                }
-            }
-            for (var propName in list[0]) {
-                if (valueMember_1 && displayMember_1)
-                    break;
-                var value = list[0][propName];
-                if (value !== undefined && value !== null) {
-                    if (!valueMember_1 && (typeof (value) === "number" || typeof (value) === "boolean")) {
-                        valueMember_1 = propName;
-                    }
-                    if (!displayMember_1 && typeof (value) === "string" && !propName.toLowerCase().endsWith("id") && propName !== "entityIdentifier") {
-                        displayMember_1 = propName;
-                    }
-                }
-            }
-            if (valueMember_1 && displayMember_1) {
-                this.items = list.map(function (item) { return ({ id: item[valueMember_1], name: item[displayMember_1] }); });
-            }
-        }
-    };
-    RadioList.prototype.render = function () {
-        var _this = this;
-        var _a;
-        this.preRender();
-        var splitProps = BindPropsHelper.normaliseEditorProps(this, this.props);
-        var domProps = BindPropsHelper.autoSetDomProperties(splitProps, this.context);
-        // TODO, how must validation show if not in form group?
-        //const displayInfo = this.props.bind.validator.getDisplayState(this.context.validationDisplayMode);
-        //displayInfo.applyToDom(domProps, !splitProps.inGroup);
-        var bindValue = this.props.bind.value;
-        var className = Utils.joinWithSpaces("neo-radio-list", (_a = splitProps.editorDom) === null || _a === void 0 ? void 0 : _a.className);
-        return React.createElement("div", { className: className }, this.items.map(function (item) {
-            return React.createElement("div", { className: "custom-control custom-radio " + (_this.props.radioList.inline ? "custom-control-inline" : "custom-control"), key: item.id },
-                React.createElement("input", { type: "radio", id: splitProps.uniqueID + item.id, name: splitProps.uniqueID, checked: bindValue === item.id, disabled: domProps.disabled || domProps.readOnly, onChange: function () { return _this.props.bind.value = item.id; }, className: "custom-control-input" }),
-                React.createElement("label", { className: "custom-control-label", htmlFor: splitProps.uniqueID + item.id }, item.name));
-        }));
-    };
-    RadioList.contextType = FormContext;
-    RadioList = __decorate([
-        observer
-    ], RadioList);
-    return RadioList;
-}(ComponentBase));
-export default RadioList;
+import { __decorate, __extends } from "tslib";
+import React from 'react';
+import { EnumHelper, Utils } from '@singularsystems/neo-core';
+import { observer } from 'mobx-react';
+import { BindPropsHelper } from './PropTypes';
+import ComponentBase from './ComponentBase';
+import { FormContext } from './FormContext';
+import LookupHelper from './DropDown/LookupHelper';
+var RadioList = /** @class */ (function (_super) {
+    __extends(RadioList, _super);
+    function RadioList() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.items = [];
+        return _this;
+    }
+    RadioList.prototype.preRender = function () {
+        if (this.props.radioList.items && this.props.radioList.items !== this.previousList) {
+            this.previousList = this.props.radioList.items;
+            this.createEnumList(this.props.radioList.items);
+        }
+        else if (this.props.radioList.enumType && this.props.radioList.enumType !== this.previousEnumType) {
+            this.previousEnumType = this.props.radioList.enumType;
+            this.items = EnumHelper.asList(this.props.radioList.enumType);
+        }
+    };
+    RadioList.prototype.createEnumList = function (list) {
+        var _a, _b;
+        if (list.length) {
+            var _c = LookupHelper.findMembers(list[0], (_a = this.props.radioList.valueMember) !== null && _a !== void 0 ? _a : "", (_b = this.props.radioList.displayMember) !== null && _b !== void 0 ? _b : "", true), valueMember_1 = _c.valueMember, displayMember_1 = _c.displayMember;
+            if (valueMember_1 && displayMember_1) {
+                this.items = list.map(function (item) { return ({ id: item[valueMember_1], name: item[displayMember_1] }); });
+            }
+        }
+    };
+    RadioList.prototype.render = function () {
+        var _this = this;
+        var _a;
+        this.preRender();
+        var splitProps = BindPropsHelper.normaliseEditorProps(this, this.props);
+        var domProps = BindPropsHelper.autoSetDomProperties(splitProps, this.context);
+        // TODO, how must validation show if not in form group?
+        //const displayInfo = this.props.bind.validator.getDisplayState(this.context.validationDisplayMode);
+        //displayInfo.applyToDom(domProps, !splitProps.inGroup);
+        var bindValue = this.props.bind.value;
+        var className = Utils.joinWithSpaces("neo-radio-list", (_a = splitProps.editorDom) === null || _a === void 0 ? void 0 : _a.className);
+        return React.createElement("div", { className: className }, this.items.map(function (item) {
+            var _a, _b;
+            return React.createElement("div", { className: "custom-control custom-radio " + (_this.props.radioList.inline ? "custom-control-inline" : "custom-control"), key: item.id },
+                React.createElement("input", { type: "radio", id: splitProps.uniqueID + ((_a = item.id) !== null && _a !== void 0 ? _a : ""), name: splitProps.uniqueID, checked: bindValue === item.id, disabled: domProps.disabled || domProps.readOnly, onChange: function () { return _this.props.bind.value = item.id; }, className: "custom-control-input" }),
+                React.createElement("label", { className: "custom-control-label", htmlFor: splitProps.uniqueID + ((_b = item.id) !== null && _b !== void 0 ? _b : "") }, item.name));
+        }));
+    };
+    RadioList.contextType = FormContext;
+    RadioList = __decorate([
+        observer
+    ], RadioList);
+    return RadioList;
+}(ComponentBase));
+export default RadioList;

package/dist/ReactComponents/Slider.d.ts

@@ -1,28 +1,28 @@
-/**
- * This component uses the rc-slider module
- * https://www.npmjs.com/package/rc-slider
- */
-import React from 'react';
-import { Model } from '@singularsystems/neo-core';
-import { SliderProps as ISliderLibProps, RangeProps as IRangeLibProps } from 'rc-slider';
-interface ICommonSliderProps {
-    bind: Model.IPropertyInstance;
-    onChangeEvent?: () => void;
-}
-interface ISliderSpecificProps extends ISliderLibProps, ICommonSliderProps {
-}
-interface IRangeSpecificProps extends IRangeLibProps, ICommonSliderProps {
-    bindEnd: Model.IPropertyInstance;
-}
-export default class Slider extends React.Component<ISliderSpecificProps | IRangeSpecificProps> {
-    private sliderImplementation;
-    private rangeImplementation;
-    private get isRange();
-    private get rangeProps();
-    private get sliderProps();
-    onChangeHandler: (value: number | number[]) => void;
-    private getSlider;
-    private getRange;
-    render(): JSX.Element;
-}
-export {};
+/**
+ * This component uses the rc-slider module
+ * https://www.npmjs.com/package/rc-slider
+ */
+import React from 'react';
+import { Model } from '@singularsystems/neo-core';
+import { SliderProps as ISliderLibProps, RangeProps as IRangeLibProps } from 'rc-slider';
+interface ICommonSliderProps {
+    bind: Model.IPropertyInstance;
+    onChangeEvent?: () => void;
+}
+interface ISliderSpecificProps extends ISliderLibProps, ICommonSliderProps {
+}
+interface IRangeSpecificProps extends IRangeLibProps, ICommonSliderProps {
+    bindEnd: Model.IPropertyInstance;
+}
+export default class Slider extends React.Component<ISliderSpecificProps | IRangeSpecificProps> {
+    private sliderImplementation;
+    private rangeImplementation;
+    private get isRange();
+    private get rangeProps();
+    private get sliderProps();
+    onChangeHandler: (value: number | number[]) => void;
+    private getSlider;
+    private getRange;
+    render(): JSX.Element;
+}
+export {};

package/dist/ReactComponents/Slider.js

@@ -1,76 +1,76 @@
-import { __assign, __decorate, __extends, __rest } from "tslib";
-/**
- * This component uses the rc-slider module
- * https://www.npmjs.com/package/rc-slider
- */
-import React from 'react';
-import { observer } from 'mobx-react';
-import { Misc } from '@singularsystems/neo-core';
-import { NeoReactTypes } from '../Modules/Types';
-var Slider = /** @class */ (function (_super) {
-    __extends(Slider, _super);
-    function Slider() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.sliderImplementation = Misc.Globals.appService.get(NeoReactTypes.Components.Slider);
-        _this.rangeImplementation = Misc.Globals.appService.get(NeoReactTypes.Components.Range);
-        _this.onChangeHandler = function (value) {
-            if (_this.isRange === false) {
-                // This is a <Slider/>
-                _this.props.bind.value = value;
-            }
-            else if (_this.isRange) {
-                // This is a <Range />
-                _this.props.bind.value = value[0];
-                _this.rangeProps.bindEnd.value = value[1];
-            }
-            // Check if there is a custom onChangeEvent prop
-            if (_this.props.onChangeEvent) {
-                _this.props.onChangeEvent();
-            }
-        };
-        return _this;
-    }
-    Object.defineProperty(Slider.prototype, "isRange", {
-        get: function () {
-            return this.props.bindEnd !== undefined;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Slider.prototype, "rangeProps", {
-        get: function () {
-            return this.props;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Slider.prototype, "sliderProps", {
-        get: function () {
-            return this.props;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Slider.prototype.getSlider = function () {
-        var _a = this.sliderProps, bind = _a.bind, onChangeEvent = _a.onChangeEvent, other = __rest(_a, ["bind", "onChangeEvent"]);
-        other.defaultValue = bind.value;
-        other.value = bind.value;
-        return React.createElement(this.sliderImplementation, __assign({}, other, { onChange: this.onChangeHandler }));
-    };
-    Slider.prototype.getRange = function () {
-        var _a = this.rangeProps, bind = _a.bind, bindEnd = _a.bindEnd, onChangeEvent = _a.onChangeEvent, other = __rest(_a, ["bind", "bindEnd", "onChangeEvent"]);
-        other.defaultValue = [bind.value, bindEnd.value];
-        other.value = [bind.value, bindEnd.value];
-        return React.createElement(this.rangeImplementation, __assign({}, other, { onChange: this.onChangeHandler }));
-    };
-    Slider.prototype.render = function () {
-        return (React.createElement("div", { className: "Slider" },
-            this.isRange && this.getRange(),
-            !this.isRange && this.getSlider()));
-    };
-    Slider = __decorate([
-        observer
-    ], Slider);
-    return Slider;
-}(React.Component));
-export default Slider;
+import { __assign, __decorate, __extends, __rest } from "tslib";
+/**
+ * This component uses the rc-slider module
+ * https://www.npmjs.com/package/rc-slider
+ */
+import React from 'react';
+import { observer } from 'mobx-react';
+import { Misc } from '@singularsystems/neo-core';
+import { NeoReactTypes } from '../Modules/Types';
+var Slider = /** @class */ (function (_super) {
+    __extends(Slider, _super);
+    function Slider() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.sliderImplementation = Misc.Globals.appService.get(NeoReactTypes.Components.Slider);
+        _this.rangeImplementation = Misc.Globals.appService.get(NeoReactTypes.Components.Range);
+        _this.onChangeHandler = function (value) {
+            if (_this.isRange === false) {
+                // This is a <Slider/>
+                _this.props.bind.value = value;
+            }
+            else if (_this.isRange) {
+                // This is a <Range />
+                _this.props.bind.value = value[0];
+                _this.rangeProps.bindEnd.value = value[1];
+            }
+            // Check if there is a custom onChangeEvent prop
+            if (_this.props.onChangeEvent) {
+                _this.props.onChangeEvent();
+            }
+        };
+        return _this;
+    }
+    Object.defineProperty(Slider.prototype, "isRange", {
+        get: function () {
+            return this.props.bindEnd !== undefined;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Slider.prototype, "rangeProps", {
+        get: function () {
+            return this.props;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Slider.prototype, "sliderProps", {
+        get: function () {
+            return this.props;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Slider.prototype.getSlider = function () {
+        var _a = this.sliderProps, bind = _a.bind, onChangeEvent = _a.onChangeEvent, other = __rest(_a, ["bind", "onChangeEvent"]);
+        other.defaultValue = bind.value;
+        other.value = bind.value;
+        return React.createElement(this.sliderImplementation, __assign({}, other, { onChange: this.onChangeHandler }));
+    };
+    Slider.prototype.getRange = function () {
+        var _a = this.rangeProps, bind = _a.bind, bindEnd = _a.bindEnd, onChangeEvent = _a.onChangeEvent, other = __rest(_a, ["bind", "bindEnd", "onChangeEvent"]);
+        other.defaultValue = [bind.value, bindEnd.value];
+        other.value = [bind.value, bindEnd.value];
+        return React.createElement(this.rangeImplementation, __assign({}, other, { onChange: this.onChangeHandler }));
+    };
+    Slider.prototype.render = function () {
+        return (React.createElement("div", { className: "Slider" },
+            this.isRange && this.getRange(),
+            !this.isRange && this.getSlider()));
+    };
+    Slider = __decorate([
+        observer
+    ], Slider);
+    return Slider;
+}(React.Component));
+export default Slider;

package/dist/ReactComponents/StateObserver.d.ts

@@ -1,15 +1,15 @@
-/// <reference types="react" />
-/**
- * Watches all observables accessed during the getState callback.
- * When any of the value of these observables change, forceUpdate is called on the component.
- */
-export declare class StateObserver<TState> {
-    private component;
-    private getState;
-    private _disposer?;
-    private inUpdate;
-    isPaused: boolean;
-    constructor(component: React.Component, getState: () => TState);
-    observe(): void;
-    dispose(): void;
-}
+/// <reference types="react" />
+/**
+ * Watches all observables accessed during the getState callback.
+ * When any of the value of these observables change, forceUpdate is called on the component.
+ */
+export declare class StateObserver<TState> {
+    private component;
+    private getState;
+    private _disposer?;
+    private inUpdate;
+    isPaused: boolean;
+    constructor(component: React.Component, getState: () => TState);
+    observe(): void;
+    dispose(): void;
+}

package/dist/ReactComponents/StateObserver.js

@@ -1,35 +1,35 @@
-import { reaction } from 'mobx';
-/**
- * Watches all observables accessed during the getState callback.
- * When any of the value of these observables change, forceUpdate is called on the component.
- */
-var StateObserver = /** @class */ (function () {
-    function StateObserver(component, getState) {
-        this.component = component;
-        this.getState = getState;
-        this.inUpdate = false;
-        this.isPaused = false;
-    }
-    StateObserver.prototype.observe = function () {
-        var _this = this;
-        if (!this.inUpdate) {
-            this.dispose();
-            this._disposer = reaction(function () {
-                return _this.getState();
-            }, function (newState) {
-                if (!_this.isPaused) {
-                    _this.inUpdate = true;
-                    _this.component.forceUpdate();
-                    _this.inUpdate = false;
-                }
-            });
-        }
-    };
-    StateObserver.prototype.dispose = function () {
-        if (this._disposer)
-            this._disposer();
-        this._disposer = undefined;
-    };
-    return StateObserver;
-}());
-export { StateObserver };
+import { reaction } from 'mobx';
+/**
+ * Watches all observables accessed during the getState callback.
+ * When any of the value of these observables change, forceUpdate is called on the component.
+ */
+var StateObserver = /** @class */ (function () {
+    function StateObserver(component, getState) {
+        this.component = component;
+        this.getState = getState;
+        this.inUpdate = false;
+        this.isPaused = false;
+    }
+    StateObserver.prototype.observe = function () {
+        var _this = this;
+        if (!this.inUpdate) {
+            this.dispose();
+            this._disposer = reaction(function () {
+                return _this.getState();
+            }, function (newState) {
+                if (!_this.isPaused) {
+                    _this.inUpdate = true;
+                    _this.component.forceUpdate();
+                    _this.inUpdate = false;
+                }
+            });
+        }
+    };
+    StateObserver.prototype.dispose = function () {
+        if (this._disposer)
+            this._disposer();
+        this._disposer = undefined;
+    };
+    return StateObserver;
+}());
+export { StateObserver };

package/dist/ReactComponents/Tabs/Tab.d.ts

@@ -1,41 +1,42 @@
-import React from "react";
-import { TabContext } from "./TabContainer";
-import { ICancellableEvent } from "../Misc";
-interface ITabProps {
-    /** Name to show in the tab header. */
-    header: string | JSX.Element;
-    /** Name used for binding to selected tab. */
-    id?: string;
-    /** Name used for binding to selected tab. (Same as id property) */
-    name?: string;
-    /** Icon to display in tab header. */
-    icon?: string;
-    /** True if the tab is disabled and not allowed to be clicked on. */
-    disabled?: boolean;
-    /**
-     * Callback to run when this tab is first displayed, or when TabManager.reset is called with reInitialise=true
-     */
-    onInitialise?: () => void;
-    /**
-     * Callback to run whenever this tab is displayed.
-     */
-    onDisplayed?: () => void;
-    /** Callback to run when selecting a different tab. The event can be cancelled. */
-    onLeave?: (e: ICancellableEvent) => void;
-    /** Child content is used as the tab body. */
-    children: React.ReactNode;
-}
-export default class Tab extends React.Component<ITabProps> {
-    static contextType: React.Context<import("./TabContainer").TabContextParams>;
-    context: React.ContextType<typeof TabContext>;
-    private isHeader?;
-    private tabKey;
-    private hasRenderedContents;
-    constructor(props: ITabProps);
-    componentDidMount(): void;
-    render(): false | JSX.Element;
-    onClick(e: React.MouseEvent<HTMLAnchorElement>): void;
-    renderHeader(isSelected: boolean): JSX.Element;
-    renderBody(isSelected: boolean): false | JSX.Element;
-}
-export {};
+import React from "react";
+import { TabContext } from "./TabContainer";
+import { ICancellableEvent } from "../Misc";
+interface ITabProps {
+    /** Name to show in the tab header. */
+    header: string | JSX.Element;
+    /** Name used for binding to selected tab. */
+    id?: string;
+    /** Name used for binding to selected tab. (Same as id property) */
+    name?: string;
+    /** Icon to display in tab header. */
+    icon?: string;
+    /** True if the tab is disabled and not allowed to be clicked on. */
+    disabled?: boolean;
+    /**
+     * Callback to run when this tab is first displayed, or when TabManager.reset is called with reInitialise=true
+     */
+    onInitialise?: () => void;
+    /**
+     * Callback to run whenever this tab is displayed.
+     */
+    onDisplayed?: () => void;
+    /** Callback to run when selecting a different tab. The event can be cancelled. */
+    onLeave?: (e: ICancellableEvent) => void;
+    /** Child content is used as the tab body. */
+    children: React.ReactNode;
+}
+export default class Tab extends React.Component<ITabProps> {
+    static contextType: React.Context<import("./TabContainer").TabContextParams>;
+    context: React.ContextType<typeof TabContext>;
+    private isHeader?;
+    private tabKey;
+    private hasRenderedContents;
+    private iconFactory;
+    constructor(props: ITabProps);
+    componentDidMount(): void;
+    render(): false | JSX.Element;
+    onClick(e: React.MouseEvent<HTMLAnchorElement>): void;
+    renderHeader(isSelected: boolean): JSX.Element;
+    renderBody(isSelected: boolean): false | JSX.Element;
+}
+export {};