@singularsystems/neo-react 1.3.9 → 1.4.0

package/CHANGELOG.md

@@ -2,6 +2,21 @@
 
 This file details all new features and changes to functionality. If you only need to see changes that require updates to your project, see the [breaking changes](./Breaking.md) readme.
 
+## Version 1.4.0 (16 April 2026)
+
+- Button
+    - Added an `isActive` prop to enable toggle buttons.
+- Icons
+    - Added `tooltip` and `className` props to the `Neo.Icon` component.
+    - Added some missing material symbols mappings.
+- Sticky table headers
+    - Fixed column widths not being restored properly.
+
+## Version 1.3.10 (19 March 2026)
+
+- AutoCompleteDropDown
+    - Fixed InputElement prop not being passed to underlying react-select component.
+
 ## Version 1.3.9 (4 March 2026)
 
 - Dropdown

package/dist/React/ReactModelCreator.d.ts

@@ -6,6 +6,7 @@ export declare class ReactModelCreator extends ModelCreatorBase {
     setupModel(typeInfo: NeoTypeInfo, model: Model.IModelBase, options: Model.IMakeBindableOptions): void;
     setupObject(typeInfo: NeoTypeInfo, object: any, options: Model.IMakeBindableOptions): void;
     private setMobxObservableType;
+    private getObservableType;
     private addChangeTracking;
     private setupList;
 }

package/dist/React/ReactModelCreator.js

@@ -81,17 +81,27 @@ var ReactModelCreator = /** @class */ (function (_super) {
     ReactModelCreator.prototype.setMobxObservableType = function (object, propertyName, property, annotations) {
         var propertyValue = object[propertyName], propertyInfo = property.propertyInfo;
         this.ensureChildInfo(object, propertyInfo);
+        var observableType = this.getObservableType(propertyInfo);
         if (propertyInfo.relationType === Misc.RelationType.ChildList) {
-            annotations[propertyName] = observable.shallow;
+            annotations[propertyName] = observableType !== null && observableType !== void 0 ? observableType : observable.shallow;
             property.convertList = propertyValue;
         }
         else if (propertyValue instanceof Array) {
-            annotations[propertyName] = observable.shallow;
+            annotations[propertyName] = observableType !== null && observableType !== void 0 ? observableType : observable.shallow;
         }
         else {
-            annotations[propertyName] = observable.ref;
+            annotations[propertyName] = observableType !== null && observableType !== void 0 ? observableType : observable.ref;
         }
     };
+    ReactModelCreator.prototype.getObservableType = function (propertyInfo) {
+        switch (propertyInfo.observableType) {
+            case Misc.ObservableType.Reference:
+                return observable.ref;
+            case Misc.ObservableType.Shallow:
+                return observable.shallow;
+        }
+        return undefined;
+    };
     ReactModelCreator.prototype.addChangeTracking = function (object, propertyName, property) {
         var _this = this;
         var propertyInfo = property.propertyInfo, propertyInstance = property.propertyInstance;

package/dist/ReactComponents/Button.js

@@ -21,6 +21,9 @@ var Button = /** @class */ (function (_super) {
         var _this = this;
         if (!this.state.isExpanded) {
             this.setState({ isExpanded: true });
+            if (this.props.onMenuOpened !== undefined) {
+                this.props.onMenuOpened();
+            }
             setTimeout(function () { return window.addEventListener("click", _this.windowClickHandler); }, 0);
         }
     };
@@ -61,7 +64,7 @@ var Button = /** @class */ (function (_super) {
     Button.prototype.render = function () {
         var _this = this;
         var _a;
-        var _b = this.props, isSubmit = _b.isSubmit, variant = _b.variant, size = _b.size, isOutline = _b.isOutline, inline = _b.inline, icon = _b.icon, iconAlignment = _b.iconAlignment, text = _b.text, menuItems = _b.menuItems, splitMenu = _b.splitMenu, menuAlignment = _b.menuAlignment, buttonGroupClassName = _b.buttonGroupClassName, tooltip = _b.tooltip, task = _b.task, isBusy = _b.isBusy, pulse = _b.pulse, customVariant = _b.customVariant, native = __rest(_b, ["isSubmit", "variant", "size", "isOutline", "inline", "icon", "iconAlignment", "text", "menuItems", "splitMenu", "menuAlignment", "buttonGroupClassName", "tooltip", "task", "isBusy", "pulse", "customVariant"]);
+        var _b = this.props, isSubmit = _b.isSubmit, variant = _b.variant, size = _b.size, isOutline = _b.isOutline, inline = _b.inline, icon = _b.icon, iconAlignment = _b.iconAlignment, text = _b.text, menuItems = _b.menuItems, splitMenu = _b.splitMenu, menuAlignment = _b.menuAlignment, buttonGroupClassName = _b.buttonGroupClassName, tooltip = _b.tooltip, task = _b.task, isBusy = _b.isBusy, pulse = _b.pulse, customVariant = _b.customVariant, isActive = _b.isActive, onMenuOpened = _b.onMenuOpened, native = __rest(_b, ["isSubmit", "variant", "size", "isOutline", "inline", "icon", "iconAlignment", "text", "menuItems", "splitMenu", "menuAlignment", "buttonGroupClassName", "tooltip", "task", "isBusy", "pulse", "customVariant", "isActive", "onMenuOpened"]);
         native.type = isSubmit ? "submit" : "button";
         var variantClassName = ((_a = customVariant !== null && customVariant !== void 0 ? customVariant : variant) !== null && _a !== void 0 ? _a : "primary");
         var isLoading = isBusy || (task === null || task === void 0 ? void 0 : task.isBusy);
@@ -90,6 +93,9 @@ var Button = /** @class */ (function (_super) {
         if (pulse) {
             buttonClasses += " ".concat(variantClassName, "-color-pulse");
         }
+        if (isActive) {
+            buttonClasses += " active";
+        }
         native.className = (native.className || "") + " " + buttonClasses;
         // Button text
         var innerText = this.props.children;

package/dist/ReactComponents/DropDown/AutoCompleteDropDown.d.ts

@@ -2,17 +2,17 @@ import React, { JSX } from 'react';
 import { Model } from '@singularsystems/neo-core';
 import { AxiosPromise } from 'axios';
 import { DropDownBase, ItemSource } from './DropDownBase';
-import type { Props } from 'react-select';
+import type { Props, SelectInstance } from 'react-select';
 import { ICommonEditorProps } from '../PropTypes';
 import { FormContext } from '../FormContext';
-interface IOption {
+interface IOption<T = any> {
     value: string | number;
     label: string;
-    item?: any;
+    item?: T;
     itemParent?: any;
     options?: IOption[];
 }
-interface IAutoCompleteCommonProps<T, TChild = T> extends ICommonEditorProps, Props<IOption, true> {
+interface IAutoCompleteCommonProps<T, TChild = T> extends ICommonEditorProps<SelectInstance>, Props<IOption, true> {
     /**
      * Callback for loading data.
      */

package/dist/ReactComponents/DropDown/AutoCompleteDropDown.js

@@ -309,11 +309,12 @@ var AutoCompleteDropDown = /** @class */ (function (_super) {
                 return !input || _this.props.inputFilter(input, option.data.item, option.data.itemParent);
             };
         }
+        var inputRef = splitProps.editor.inputElement;
         if (this.props.itemSource !== undefined) {
-            return Tooltip.fromDataAttributes(InputHelpers.surroundWithInputGroup(React.createElement(this.asyncSelectImplementation, __assign({}, nativeProps, { placeholder: (_h = this.props.placeholder) !== null && _h !== void 0 ? _h : "", classNamePrefix: "react-select-bs", defaultOptions: defaultItems, loadOptions: this.onKeyPress, isMulti: bindItems !== undefined, noOptionsMessage: function (c) { var _a, _b; return c.inputValue && c.inputValue.length >= (minCharacters !== null && minCharacters !== void 0 ? minCharacters : 1) ? ((_a = _this.props.noRecordsPrompt) !== null && _a !== void 0 ? _a : "No records found") : ((_b = _this.props.typeToSearchPrompt) !== null && _b !== void 0 ? _b : "Type to search..."); }, value: value, onChange: this.onItemSelected, components: components })), splitProps.editor, { disabled: nativeProps.isDisabled }), nativeProps);
+            return Tooltip.fromDataAttributes(InputHelpers.surroundWithInputGroup(React.createElement(this.asyncSelectImplementation, __assign({}, nativeProps, { placeholder: (_h = this.props.placeholder) !== null && _h !== void 0 ? _h : "", classNamePrefix: "react-select-bs", defaultOptions: defaultItems, loadOptions: this.onKeyPress, isMulti: bindItems !== undefined, noOptionsMessage: function (c) { var _a, _b; return c.inputValue && c.inputValue.length >= (minCharacters !== null && minCharacters !== void 0 ? minCharacters : 1) ? ((_a = _this.props.noRecordsPrompt) !== null && _a !== void 0 ? _a : "No records found") : ((_b = _this.props.typeToSearchPrompt) !== null && _b !== void 0 ? _b : "Type to search..."); }, value: value, onChange: this.onItemSelected, components: components, ref: inputRef })), splitProps.editor, { disabled: nativeProps.isDisabled }), nativeProps);
         }
         else {
-            return Tooltip.fromDataAttributes(InputHelpers.surroundWithInputGroup(React.createElement(this.selectImplementation, __assign({}, nativeProps, { placeholder: (_j = this.props.placeholder) !== null && _j !== void 0 ? _j : "", classNamePrefix: "react-select-bs", options: defaultItems, isLoading: this.isLoading, isMulti: bindItems !== undefined, noOptionsMessage: function (c) { var _a; return (_a = _this.props.noRecordsPrompt) !== null && _a !== void 0 ? _a : "No records found"; }, value: value, onChange: this.onItemSelected, components: components })), splitProps.editor, { disabled: nativeProps.isDisabled }), nativeProps);
+            return Tooltip.fromDataAttributes(InputHelpers.surroundWithInputGroup(React.createElement(this.selectImplementation, __assign({}, nativeProps, { placeholder: (_j = this.props.placeholder) !== null && _j !== void 0 ? _j : "", classNamePrefix: "react-select-bs", options: defaultItems, isLoading: this.isLoading, isMulti: bindItems !== undefined, noOptionsMessage: function (c) { var _a; return (_a = _this.props.noRecordsPrompt) !== null && _a !== void 0 ? _a : "No records found"; }, value: value, onChange: this.onItemSelected, components: components, ref: inputRef })), splitProps.editor, { disabled: nativeProps.isDisabled }), nativeProps);
         }
     };
     AutoCompleteDropDown.prototype.getOption = function (content, additionalClass) {

package/dist/ReactComponents/Grid/StickyTableHeader.d.ts

@@ -24,7 +24,6 @@ export declare class StickyTableHeader {
     private removeCopy;
     private onPossibleContentChange;
     private syncColumnWidths;
-    private storeColumnWidths;
     private restoreColumnWidths;
     dispose(): void;
     /**

package/dist/ReactComponents/Grid/StickyTableHeader.js

@@ -57,8 +57,7 @@ var StickyTableHeader = /** @class */ (function () {
                 this.headerCopy = this.header.cloneNode(true);
                 this.table.insertBefore(this.headerCopy, this.header);
                 this.header.classList.add("neo-grid-fixed-header");
-                this.storeColumnWidths();
-                this.syncColumnWidths();
+                this.syncColumnWidths(true);
                 this.domObserver.observe(this.header, { childList: true, subtree: true, attributes: false });
             }
             this.header.style.left = tableBounds.left + "px";
@@ -89,7 +88,11 @@ var StickyTableHeader = /** @class */ (function () {
         var _this = this;
         setTimeout(function () { return _this.syncColumnWidths(); }, 0);
     };
-    StickyTableHeader.prototype.syncColumnWidths = function () {
+    StickyTableHeader.prototype.syncColumnWidths = function (storeWidths) {
+        if (storeWidths === void 0) { storeWidths = false; }
+        if (storeWidths) {
+            this.originalWidths = [];
+        }
         if (this.headerCopy) {
             for (var i = 0; i < this.header.rows.length; i++) {
                 var originalRow = this.header.rows[i], copyRow = this.headerCopy.rows[i];
@@ -100,6 +103,14 @@ var StickyTableHeader = /** @class */ (function () {
                 }
                 for (var j = 0; j < originalRow.cells.length; j++) {
                     var originalCell = originalRow.cells[j], copyCell = copyRow.cells[j];
+                    if (storeWidths) {
+                        this.originalWidths.push({
+                            cell: originalCell,
+                            width: originalCell.style.width,
+                            minWidth: originalCell.style.minWidth,
+                            maxWidth: originalCell.style.maxWidth
+                        });
+                    }
                     originalCell.style.width = window.getComputedStyle(copyCell).width;
                     originalCell.style.minWidth = originalCell.style.width;
                     originalCell.style.maxWidth = originalCell.style.width;
@@ -107,20 +118,12 @@ var StickyTableHeader = /** @class */ (function () {
             }
         }
     };
-    StickyTableHeader.prototype.storeColumnWidths = function () {
-        this.originalWidths = [];
-        for (var i = 0; i < this.header.rows.length; i++) {
-            var row = this.header.rows[i];
-            for (var j = 0; j < row.cells.length; j++) {
-                var cell = row.cells[j];
-                this.originalWidths.push({ cell: cell, width: cell.style.width });
-            }
-        }
-    };
     StickyTableHeader.prototype.restoreColumnWidths = function () {
         for (var _i = 0, _a = this.originalWidths; _i < _a.length; _i++) {
             var cellRef = _a[_i];
             cellRef.cell.style.width = cellRef.width;
+            cellRef.cell.style.minWidth = cellRef.minWidth;
+            cellRef.cell.style.maxWidth = cellRef.maxWidth;
         }
     };
     StickyTableHeader.prototype.dispose = function () {

package/dist/ReactComponents/GridLayout.js

@@ -52,7 +52,6 @@ var GridLayout = /** @class */ (function (_super) {
             var itemsPerRow = Math.ceil(childCount / maxColumns);
             var rows = [];
             for (var i = 0; i < maxColumns; i++) {
-                BootstrapUtils;
                 rows.push(React.createElement("div", { key: i }, childItems.splice(0, itemsPerRow)));
             }
             childItems = rows;

package/dist/ReactComponents/Icons/IIconFactory.d.ts

@@ -1,3 +1,4 @@
+import { Components } from "@singularsystems/neo-core";
 export interface IconStyle {
     /** True if the icon should be fixed width */
     fixedWidth?: boolean;
@@ -9,6 +10,8 @@ export interface IconStyle {
     weight?: number;
     /** Specific font size. Any valid css font size. */
     size?: string;
+    tooltip?: string | Components.Tooltip.ITooltipOptions;
+    className?: string;
 }
 export interface IIconFactory {
     /**

package/dist/ReactComponents/Icons/IconFactory.js

@@ -1,7 +1,8 @@
-import { __decorate } from "tslib";
+import { __assign, __decorate } from "tslib";
 import { Utils } from "@singularsystems/neo-core";
 import React from "react";
 import { injectable } from 'inversify';
+import Tooltip from "../Tooltip";
 /** Default icon factory supporting font-awesome strings. */
 var IconFactory = /** @class */ (function () {
     function IconFactory() {
@@ -44,7 +45,14 @@ var IconFactory = /** @class */ (function () {
             inlineStyle = { fontSize: style.size };
         }
         className += " neo-icon";
-        return React.createElement("i", { className: className, style: inlineStyle });
+        if (style === null || style === void 0 ? void 0 : style.className) {
+            className += " " + style.className;
+        }
+        var tooltipProps = {};
+        if (style === null || style === void 0 ? void 0 : style.tooltip) {
+            Tooltip.setDomProperties(tooltipProps, style.tooltip);
+        }
+        return React.createElement("i", __assign({ className: className, style: inlineStyle }, tooltipProps));
     };
     IconFactory.prototype.createIconComponent = function (iconDescriptor, style) {
         return iconDescriptor;

package/dist/ReactComponents/Icons/MaterialSymbolsFontFactory.js

@@ -1,7 +1,8 @@
-import { __extends } from "tslib";
+import { __assign, __extends } from "tslib";
 import { Utils } from "@singularsystems/neo-core";
 import React from "react";
 import { IconFactory } from ".";
+import Tooltip from "../Tooltip";
 /**
  * Font factory that renders google material symbols icons.
  */
@@ -33,6 +34,9 @@ var MaterialSymbolsFontFactory = /** @class */ (function (_super) {
         if (style === null || style === void 0 ? void 0 : style.spin) {
             className += " fa fa-spin";
         }
+        if (style === null || style === void 0 ? void 0 : style.className) {
+            className += " " + style.className;
+        }
         // remove and extract convention styling
         iconName = iconName.replace("fa-fw", "");
         var faProps = Utils.getFontAwesomeIconProps(iconName);
@@ -66,7 +70,11 @@ var MaterialSymbolsFontFactory = /** @class */ (function (_super) {
             cssStyle !== null && cssStyle !== void 0 ? cssStyle : (cssStyle = {});
             cssStyle.fontSize = style.size;
         }
-        return React.createElement("span", { className: className, style: cssStyle }, mappedName);
+        var tooltipProps = {};
+        if (style === null || style === void 0 ? void 0 : style.tooltip) {
+            Tooltip.setDomProperties(tooltipProps, style.tooltip);
+        }
+        return React.createElement("span", __assign({ className: className, style: cssStyle }, tooltipProps), mappedName);
     };
     MaterialSymbolsFontFactory.prototype.mapFontAwesomeToMaterial = function (faName) {
         return this.fontAwesomeMap.get(faName.trim());
@@ -119,5 +127,8 @@ var neoFontAwesomeMappings = [
     ["stamp", "approval"],
     ["circle-notch", "progress_activity"],
     ["cube", "deployed_code"],
-    ["paper-plane", "send"]
+    ["paper-plane", "send"],
+    ["layer-group", "layers"],
+    ["arrow-up-right-from-square", "open_in_new"],
+    ["file", "draft"]
 ];

package/dist/ReactComponents/PropTypes.d.ts

@@ -25,7 +25,7 @@ export declare enum CheckboxType {
     Checkbox = 1,
     Switch = 2
 }
-export interface ICommonEditorProps {
+export interface ICommonEditorProps<TInputRef = HTMLElement> {
     /** True if the editor should be readonly. This is set automatically if you use display instead of bind on a FormGroup / Column. */
     isReadOnly?: boolean;
     /** True if the editor should be readonly. This is set automatically if you use display instead of bind on a FormGroup / Column. */
@@ -49,7 +49,7 @@ export interface ICommonEditorProps {
     /** True if append / prepend is set, which means this must be an editor as part of a bs editor group. */
     requiresGroup?: boolean;
     /** Reference to the input dom element */
-    inputElement?: React.RefObject<HTMLElement | null>;
+    inputElement?: React.RefObject<TInputRef | null>;
 }
 export interface IBindableEditorPropsNoBase extends ICommonEditorProps {
     bind: Model.IPropertyInstance;
@@ -141,7 +141,7 @@ export declare class BindPropsHelper {
     static getBindProperty<T>(allProps: IEditorContainerProps<T, any>): Model.IPropertyInstance;
     static splitCommonEditorProps<T extends ICommonEditorProps>(props: T): {
         editor: ICommonEditorProps;
-        rest: Omit<T, "disabled" | "readOnly" | "isReadOnly" | "isDisabled" | "prependText" | "appendText" | "prepend" | "append" | "prependIcon" | "appendIcon" | "inputElement">;
+        rest: Omit<T, "disabled" | "readOnly" | "isReadOnly" | "isDisabled" | "prependText" | "appendText" | "prepend" | "append" | "prependIcon" | "appendIcon" | "requiresGroup" | "inputElement">;
     };
     static normaliseContainerProps<T, TContainerDom = React.HTMLProps<T>, TData = any>(component: IComponentBase, props: IEditorContainerProps<T, TData>, inGroup: boolean, isBootstrap?: boolean): IEditorContainerNormalisedProps<TContainerDom, TData>;
     static normaliseEditorProps<T, TDom = React.HTMLProps<T>>(component: IComponentBase, props: (IEditorAndSelectorProps<T, any> & TDom) | IEditorNormalisedProps<TDom, any>): IEditorNormalisedProps<TDom, any>;

package/dist/ReactComponents/PropTypes.js

@@ -102,7 +102,7 @@ var BindPropsHelper = /** @class */ (function () {
         return (allProps.bind || allProps.display || allProps.bindContext);
     };
     BindPropsHelper.splitCommonEditorProps = function (props) {
-        var isReadOnly = props.isReadOnly, readOnly = props.readOnly, isDisabled = props.isDisabled, disabled = props.disabled, prependText = props.prependText, prepend = props.prepend, prependIcon = props.prependIcon, appendText = props.appendText, append = props.append, appendIcon = props.appendIcon, inputElement = props.inputElement, rest = __rest(props, ["isReadOnly", "readOnly", "isDisabled", "disabled", "prependText", "prepend", "prependIcon", "appendText", "append", "appendIcon", "inputElement"]);
+        var isReadOnly = props.isReadOnly, readOnly = props.readOnly, isDisabled = props.isDisabled, disabled = props.disabled, prependText = props.prependText, prepend = props.prepend, prependIcon = props.prependIcon, appendText = props.appendText, append = props.append, appendIcon = props.appendIcon, inputElement = props.inputElement, requiresGroup = props.requiresGroup, rest = __rest(props, ["isReadOnly", "readOnly", "isDisabled", "disabled", "prependText", "prepend", "prependIcon", "appendText", "append", "appendIcon", "inputElement", "requiresGroup"]);
         return {
             editor: {
                 isReadOnly: (isReadOnly !== null && isReadOnly !== void 0 ? isReadOnly : readOnly), isDisabled: (isDisabled !== null && isDisabled !== void 0 ? isDisabled : disabled),

package/dist/Routing/NavigationHelper.d.ts

@@ -34,6 +34,14 @@ export default class NavigationHelper implements INavigationHelper {
     private isPrompting;
     navigateInternal(url: string, replace?: boolean): Promise<boolean>;
     navigateToView<TParams extends RouteParameterObject<TParams>>(view: ViewConstructor<TParams>, paramValues?: ParamValues<TParams>): void;
+    openWindow(path: string, state?: {
+        name: string;
+        value: object;
+    }, options?: {
+        target?: string;
+        features?: string;
+    }): Window | null;
+    readOpenerState(name: string, reset?: boolean): object | undefined;
     getPathForView<TParams extends RouteParameterObject<TParams>>(view: ViewConstructor<TParams>, paramValues?: ParamValues<TParams>): string;
     getCurrentViewPath(): string;
     private historyPopState;

package/dist/Routing/NavigationHelper.js

@@ -75,6 +75,24 @@ var NavigationHelper = /** @class */ (function () {
     NavigationHelper.prototype.navigateToView = function (view, paramValues) {
         this.navigateInternal(this.getPathForView(view, paramValues));
     };
+    NavigationHelper.prototype.openWindow = function (path, state, options) {
+        var newWindow = window.open(this.routingState.basePath + path, options === null || options === void 0 ? void 0 : options.target, options === null || options === void 0 ? void 0 : options.features);
+        if (newWindow && state) {
+            // @ts-ignore
+            newWindow["__neoOpenerState" + state.name] = state.value;
+        }
+        return newWindow;
+    };
+    NavigationHelper.prototype.readOpenerState = function (name, reset) {
+        if (reset === void 0) { reset = true; }
+        // @ts-ignore
+        var openerState = window["__neoOpenerState" + name];
+        if (reset && openerState !== undefined) {
+            // @ts-ignore
+            window["__neoOpenerState" + name] = undefined;
+        }
+        return openerState;
+    };
     NavigationHelper.prototype.getPathForView = function (view, paramValues) {
         var basePath = this.routingState.appRouteProvider.getPathForComponent(view);
         if (basePath !== undefined) {

package/dist/Routing/ViewParameter.d.ts

@@ -70,6 +70,7 @@ export declare class ViewParameter implements IViewParameter {
         hasQuery: boolean;
     }): string;
     get latestValue(): string | null;
+    private getStringValue;
 }
 interface IViewParameterPrefix {
     /** Label to show on breadcrumb. */

package/dist/Routing/ViewParameter.js

@@ -26,13 +26,7 @@ var ViewParameter = /** @class */ (function () {
             return this._value;
         },
         set: function (value) {
-            var stringValue;
-            if (value instanceof Array) {
-                stringValue = value.join(",");
-            }
-            else {
-                stringValue = value ? value.toString() : null;
-            }
+            var stringValue = this.getStringValue(value);
             if (stringValue !== this._value) {
                 this.hasPendingValue = true;
                 this.pendingValue = stringValue;
@@ -122,6 +116,14 @@ var ViewParameter = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    ViewParameter.prototype.getStringValue = function (value) {
+        if (value instanceof Array) {
+            return value.join(",");
+        }
+        else {
+            return value ? value.toString() : null;
+        }
+    };
     __decorate([
         observable.ref,
         __metadata("design:type", String)

package/dist/Routing/ViewParameterList.d.ts

@@ -16,7 +16,7 @@ export interface IViewParameterList {
     /**
      * Returns the breadcrumb items for all url parameters which have a value.
      */
-    getBreadCrumbList(): BreadCrumbItem[];
+    getBreadCrumbList(upTo?: ViewParameter): BreadCrumbItem[];
 }
 export interface IViewParameterListOfT<TParams extends RouteParameterObject<TParams>> extends IViewParameterList {
     /**
@@ -43,6 +43,7 @@ export declare class ViewParameterList<TParams extends RouteParameterObject<TPar
         [P in keyof TParams]?: number | string | string[] | null;
     }, options?: ISetValuesOptions | boolean): void;
     setUrl(viewParameter: ViewParameter | null, replace?: boolean): void;
+    getUrl(viewParameter: ViewParameter): string | undefined;
     /**
      * Gets a url for an object with view params specified.
      * @param basePath Base path without parameters

package/dist/Routing/ViewParameterList.js

@@ -97,15 +97,22 @@ var ViewParameterList = /** @class */ (function () {
         else {
             var navigationHelper = Misc.Globals.appService.get(NeoReactTypes.Routing.NavigationHelper);
             if (viewParameter) {
-                var allItems = this.getBreadCrumbList(viewParameter);
-                if (allItems.length > 0) {
-                    navigationHelper.navigateInternal(allItems[allItems.length - 1].link, replace);
+                var url = this.getUrl(viewParameter);
+                if (url) {
+                    navigationHelper.navigateInternal(url, replace);
                     return;
                 }
             }
             navigationHelper.navigateInternal(navigationHelper.getCurrentViewPath(), replace);
         }
     };
+    ViewParameterList.prototype.getUrl = function (viewParameter) {
+        var allItems = this.getBreadCrumbList(viewParameter);
+        if (allItems.length > 0) {
+            return allItems[allItems.length - 1].link;
+        }
+        return undefined;
+    };
     /**
      * @internal
      * Updates the parameter values from the values in the url. Returns true if any of the values have changed.

package/dist/Views/ViewBase.js

@@ -29,8 +29,8 @@ var ViewBase = /** @class */ (function (_super) {
         }
         _this.viewName = viewName;
         _this.viewState = _this.getStoredViewState(viewModel);
-        _this.routingState.currentView = _this;
         makeObservable(_this);
+        _this.routingState.currentView = _this;
         return _this;
     }
     Object.defineProperty(ViewBase, "currentView", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@singularsystems/neo-react",
-  "version": "1.3.9",
+  "version": "1.4.0",
   "description": "React application logic and components for the Neo client library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -42,7 +42,7 @@
     "tslib": "2.8.1"
   },
   "peerDependencies": {
-    "@singularsystems/neo-core": ">=1.3.6",
+    "@singularsystems/neo-core": ">=1.4.0",
     "axios": ">=1.6.2",
     "inversify": ">=5.0.1",
     "mobx": ">=6.9.0",