cx 26.1.0 → 26.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "cx",
-   "version": "26.1.0",
+   "version": "26.1.1",
    "description": "Advanced JavaScript UI framework for admin and dashboard applications with ready to use grid, form and chart components.",
    "exports": {
       "./data": {
@@ -74,6 +74,7 @@
    },
    "peerDependencies": {
       "@types/react": ">=18",
+      "@types/react-dom": ">=18",
       "cx-react": ">=26",
       "react": ">=18",
       "react-dom": ">=18"
@@ -88,6 +89,7 @@
       "@types/node": "^25.0.3",
       "@types/react-dom": "^19.2.3",
       "@types/react-test-renderer": "^19.1.0",
+      "mocha": "^11.7.5",
       "react-test-renderer": "^19.2.3",
       "ts-mocha": "^11.1.0",
       "ts-node": "^10.9.2",

package/src/core.d.ts

@@ -1,182 +1,182 @@
-export = Cx;
-export as namespace Cx;
-
-import * as React from "react";
-import { Instance } from "./ui/Instance";
-import { RenderingContext } from "./ui/RenderingContext";
-import { AccessorChain as AccessorChainType } from "./data/createAccessorModelProxy";
-import { Selector as SelectorType } from "./data/Selector";
-import type {
-   Bind as BindType,
-   Tpl as TplType,
-   Expr as ExprType,
-   Binding as BindingType,
-   GetSet as GetSetType,
-   Prop as PropType,
-   StructuredSelector as StructuredSelectorType,
-   DataRecord,
-   Config as ConfigType,
-   StructuredProp as StructuredPropType,
-   StringProp as StringPropType,
-   StyleProp as StylePropType,
-   NumberProp as NumberPropType,
-   BooleanProp as BooleanPropType,
-   ClassProp as ClassPropType,
-   RecordsProp as RecordsPropType,
-   SortersProp as SortersPropType,
-   UnknownProp as UnknownPropType,
-   RecordAlias as RecordAliasType,
-   SortDirection as SortDirectionType,
-   Sorter as SorterType,
-   CollatorOptions as CollatorOptionsType,
-} from "./ui/Prop";
-
-/** @deprecated */
-declare namespace Cx {
-   // Re-export AccessorChain type from createAccessorModelProxy
-   type AccessorChain<M> = AccessorChainType<M>;
-
-   // Re-export Selector type from data/Selector
-   type Selector<T> = SelectorType<T>;
-
-   // Re-export binding types from Prop.ts
-   type Bind = BindType;
-   type Tpl = TplType;
-   type Expr = ExprType;
-   type Binding = BindingType;
-   type GetSet<T> = GetSetType<T>;
-
-   // Re-export types from Prop.ts
-   type Prop<T> = PropType<T>;
-
-   interface StructuredSelector extends StructuredSelectorType {}
-
-   interface Record extends DataRecord {}
-
-   interface Config extends ConfigType {}
-
-   interface StructuredProp extends StructuredPropType {}
-
-   type StringProp = StringPropType;
-   type StyleProp = StylePropType;
-   type NumberProp = NumberPropType;
-   type BooleanProp = BooleanPropType;
-   type ClassProp = ClassPropType;
-   type RecordsProp = RecordsPropType;
-   type SortersProp = SortersPropType;
-   type UnknownProp = UnknownPropType;
-
-   type RecordAlias = RecordAliasType;
-
-   /** @deprecated */
-   interface WidgetProps {
-      /** Inner layout used to display children inside the widget. */
-      layout?: any;
-
-      /** Outer (wrapper) layout used to display the widget in. */
-      outerLayout?: any;
-
-      /** Name of the ContentPlaceholder that should be used to display the widget. */
-      putInto?: string;
-
-      /** Name of the ContentPlaceholder that should be used to display the widget. */
-      contentFor?: string;
-
-      /** Controller. */
-      controller?: any;
-
-      /** Visibility of the widget. Defaults to `true`. */
-      visible?: BooleanProp;
-
-      /** Visibility of the widget. Defaults to `true`. */
-      if?: BooleanProp;
-
-      /** Appearance modifier. For example, mod="big" will add the CSS class `.cxm-big` to the block element. */
-      mod?: StringProp | Prop<string[]> | StructuredProp;
-
-      /** Cache render output. Default is `true`. */
-      memoize?: BooleanProp;
-
-      /** Widget supports class, className and style attributes. */
-      styled?: boolean;
-
-      /** Key that will be used as the key when rendering the React component.  */
-      vdomKey?: string;
-
-      onExplore?(context?: any, instance?: any): void;
-
-      onPrepare?(context?: any, instance?: any): void;
-
-      onCleanup?(context?: any, instance?: any): void;
-
-      onDestroy?(): void;
-   }
-
-   /** @deprecated */
-   interface PureContainerProps extends WidgetProps {
-      /** Keep whitespace in text based children. Default is `false`. See also `trimWhitespace`. */
-      ws?: boolean;
-
-      /** Remove all whitespace in text based children. Default is `true`. See also `preserveWhitespace`. */
-      trimWhitespace?: boolean;
-
-      /** Keep whitespace in text based children. Default is `false`. See also `trimWhitespace`. */
-      preserveWhitespace?: boolean;
-
-      /** List of child elements. */
-      items?: any;
-
-      /** List of child elements. */
-      children?: React.ReactNode;
-
-      plainText?: boolean;
-   }
-
-   /** @deprecated */
-   interface StyledContainerProps extends PureContainerProps {
-      /**
-       * Additional CSS classes to be applied to the element.
-       * If an object is provided, all keys with a "truthy" value will be added to the CSS class list.
-       */
-      class?: ClassProp;
-
-      /**
-       * Additional CSS classes to be applied to the element.
-       * If an object is provided, all keys with a "truthy" value will be added to the CSS class list.
-       */
-      className?: ClassProp;
-
-      /** Style object applied to the element */
-      style?: StyleProp;
-
-      /** Style object applied to the element */
-      styles?: StyleProp;
-   }
-
-   /** @deprecated */
-   interface HtmlElementProps extends StyledContainerProps {
-      /** Id of the element */
-      id?: Cx.StringProp | Cx.NumberProp;
-
-      /** Inner text contents. */
-      text?: Cx.StringProp | Cx.NumberProp;
-
-      /** Tooltip configuration. */
-      tooltip?: StringProp | StructuredProp;
-
-      // onMouseDown?: string | ((event: MouseEvent, instance: any) => void);
-      // onMouseMove?: string | ((event: MouseEvent, instance: any) => void);
-      // onMouseUp?: string | ((event: MouseEvent, instance: any) => void);
-      // onTouchStart?: string | ((event: TouchEvent, instance: any) => void);
-      // onTouchMove?: string | ((event: TouchEvent, instance: any) => void);
-      // onTouchEnd?: string | ((event: TouchEvent, instance: any) => void);
-      // onClick?: string | ((event: MouseEvent, instance: any) => void);
-      // onContextMenu?: string | ((event: MouseEvent, instance: any) => void);
-   }
-
-   type SortDirection = SortDirectionType;
-
-   interface Sorter extends SorterType {}
-
-   interface CollatorOptions extends CollatorOptionsType {}
-}
+export = Cx;
+export as namespace Cx;
+
+import * as React from "react";
+import { Instance } from "./ui/Instance";
+import { RenderingContext } from "./ui/RenderingContext";
+import { AccessorChain as AccessorChainType } from "./data/createAccessorModelProxy";
+import { Selector as SelectorType } from "./data/Selector";
+import type {
+   Bind as BindType,
+   Tpl as TplType,
+   Expr as ExprType,
+   Binding as BindingType,
+   GetSet as GetSetType,
+   Prop as PropType,
+   StructuredSelector as StructuredSelectorType,
+   DataRecord,
+   Config as ConfigType,
+   StructuredProp as StructuredPropType,
+   StringProp as StringPropType,
+   StyleProp as StylePropType,
+   NumberProp as NumberPropType,
+   BooleanProp as BooleanPropType,
+   ClassProp as ClassPropType,
+   RecordsProp as RecordsPropType,
+   SortersProp as SortersPropType,
+   UnknownProp as UnknownPropType,
+   RecordAlias as RecordAliasType,
+   SortDirection as SortDirectionType,
+   Sorter as SorterType,
+   CollatorOptions as CollatorOptionsType,
+} from "./ui/Prop";
+
+/** @deprecated */
+declare namespace Cx {
+   // Re-export AccessorChain type from createAccessorModelProxy
+   type AccessorChain<M> = AccessorChainType<M>;
+
+   // Re-export Selector type from data/Selector
+   type Selector<T> = SelectorType<T>;
+
+   // Re-export binding types from Prop.ts
+   type Bind = BindType;
+   type Tpl = TplType;
+   type Expr = ExprType;
+   type Binding = BindingType;
+   type GetSet<T> = GetSetType<T>;
+
+   // Re-export types from Prop.ts
+   type Prop<T> = PropType<T>;
+
+   interface StructuredSelector extends StructuredSelectorType {}
+
+   interface Record extends DataRecord {}
+
+   interface Config extends ConfigType {}
+
+   interface StructuredProp extends StructuredPropType {}
+
+   type StringProp = StringPropType;
+   type StyleProp = StylePropType;
+   type NumberProp = NumberPropType;
+   type BooleanProp = BooleanPropType;
+   type ClassProp = ClassPropType;
+   type RecordsProp = RecordsPropType;
+   type SortersProp = SortersPropType;
+   type UnknownProp = UnknownPropType;
+
+   type RecordAlias = RecordAliasType;
+
+   /** @deprecated */
+   interface WidgetProps {
+      /** Inner layout used to display children inside the widget. */
+      layout?: any;
+
+      /** Outer (wrapper) layout used to display the widget in. */
+      outerLayout?: any;
+
+      /** Name of the ContentPlaceholder that should be used to display the widget. */
+      putInto?: string;
+
+      /** Name of the ContentPlaceholder that should be used to display the widget. */
+      contentFor?: string;
+
+      /** Controller. */
+      controller?: any;
+
+      /** Visibility of the widget. Defaults to `true`. */
+      visible?: BooleanProp;
+
+      /** Visibility of the widget. Defaults to `true`. */
+      if?: BooleanProp;
+
+      /** Appearance modifier. For example, mod="big" will add the CSS class `.cxm-big` to the block element. */
+      mod?: StringProp | Prop<string[]> | StructuredProp;
+
+      /** Cache render output. Default is `true`. */
+      memoize?: BooleanProp;
+
+      /** Widget supports class, className and style attributes. */
+      styled?: boolean;
+
+      /** Key that will be used as the key when rendering the React component.  */
+      vdomKey?: string;
+
+      onExplore?(context?: any, instance?: any): void;
+
+      onPrepare?(context?: any, instance?: any): void;
+
+      onCleanup?(context?: any, instance?: any): void;
+
+      onDestroy?(): void;
+   }
+
+   /** @deprecated */
+   interface PureContainerProps extends WidgetProps {
+      /** Keep whitespace in text based children. Default is `false`. See also `trimWhitespace`. */
+      ws?: boolean;
+
+      /** Remove all whitespace in text based children. Default is `true`. See also `preserveWhitespace`. */
+      trimWhitespace?: boolean;
+
+      /** Keep whitespace in text based children. Default is `false`. See also `trimWhitespace`. */
+      preserveWhitespace?: boolean;
+
+      /** List of child elements. */
+      items?: any;
+
+      /** List of child elements. */
+      children?: React.ReactNode;
+
+      plainText?: boolean;
+   }
+
+   /** @deprecated */
+   interface StyledContainerProps extends PureContainerProps {
+      /**
+       * Additional CSS classes to be applied to the element.
+       * If an object is provided, all keys with a "truthy" value will be added to the CSS class list.
+       */
+      class?: ClassProp;
+
+      /**
+       * Additional CSS classes to be applied to the element.
+       * If an object is provided, all keys with a "truthy" value will be added to the CSS class list.
+       */
+      className?: ClassProp;
+
+      /** Style object applied to the element */
+      style?: StyleProp;
+
+      /** Style object applied to the element */
+      styles?: StyleProp;
+   }
+
+   /** @deprecated */
+   interface HtmlElementProps extends StyledContainerProps {
+      /** Id of the element */
+      id?: Cx.StringProp | Cx.NumberProp;
+
+      /** Inner text contents. */
+      text?: Cx.StringProp | Cx.NumberProp;
+
+      /** Tooltip configuration. */
+      tooltip?: StringProp | StructuredProp;
+
+      // onMouseDown?: string | ((event: MouseEvent, instance: any) => void);
+      // onMouseMove?: string | ((event: MouseEvent, instance: any) => void);
+      // onMouseUp?: string | ((event: MouseEvent, instance: any) => void);
+      // onTouchStart?: string | ((event: TouchEvent, instance: any) => void);
+      // onTouchMove?: string | ((event: TouchEvent, instance: any) => void);
+      // onTouchEnd?: string | ((event: TouchEvent, instance: any) => void);
+      // onClick?: string | ((event: MouseEvent, instance: any) => void);
+      // onContextMenu?: string | ((event: MouseEvent, instance: any) => void);
+   }
+
+   type SortDirection = SortDirectionType;
+
+   interface Sorter extends SorterType {}
+
+   interface CollatorOptions extends CollatorOptionsType {}
+}

package/src/data/ArrayElementView.ts

@@ -1,90 +1,90 @@
-import { AugmentedViewBase } from "./AugmentedViewBase";
-import { isArray } from "../util/isArray";
-import { Binding } from "./Binding";
-import { View } from "./View";
-
-export interface ArrayElementViewConfig {
-   store: View;
-   arrayAccessor: any;
-   immutable?: boolean;
-   recordAlias?: string;
-   indexAlias?: string;
-   lengthAlias?: string;
-   hasNestedAliases?: boolean;
-   recordBinding?: any;
-   indexBinding?: any;
-   lengthBinding?: any;
-   itemIndex: number;
-   sealed?: boolean;
-}
-
-export class ArrayElementView extends AugmentedViewBase {
-   declare arrayAccessor: any;
-   declare recordAlias: string;
-   declare indexAlias: string;
-   declare lengthAlias: string;
-   declare hasNestedAliases?: boolean;
-   declare recordBinding?: any;
-   declare indexBinding?: any;
-   declare lengthBinding?: any;
-   declare itemIndex: number;
-
-   constructor(config: ArrayElementViewConfig) {
-      super(config);
-      this.hasNestedAliases =
-         this.recordAlias.indexOf(".") >= 0 || this.indexAlias.indexOf(".") >= 0 || this.lengthAlias.indexOf(".") >= 0;
-      this.recordBinding = Binding.get(this.recordAlias);
-      if (this.hasNestedAliases) {
-         this.indexBinding = Binding.get(this.indexAlias);
-         this.lengthBinding = Binding.get(this.lengthAlias);
-      }
-   }
-
-   getExtraKeyBinding(key: string): any {
-      if (!key.startsWith(this.recordAlias)) return null;
-      if (key.length == this.recordAlias.length || key[this.recordAlias.length] == ".") return this.recordBinding;
-      return null;
-   }
-
-   deleteExtraKeyValue(key: string): boolean {
-      if (key != this.recordAlias) throw new Error(`Field ${key} cannot be deleted.`);
-      const array = this.arrayAccessor.get(this.store.getData());
-      if (!array) return false;
-      const newArray = [...array.slice(0, this.itemIndex), ...array.slice(this.itemIndex + 1)];
-      return this.arrayAccessor.set(newArray, this.store);
-   }
-
-   setExtraKeyValue(key: string, value: any): boolean {
-      if (key != this.recordAlias) throw new Error(`Field ${key} is read-only.`);
-      const array = this.arrayAccessor.get(this.store.getData());
-      if (!array || value === array[this.itemIndex]) return false;
-      const newArray = [...array.slice(0, this.itemIndex), value, ...array.slice(this.itemIndex + 1)];
-      return this.arrayAccessor.set(newArray, this.store);
-   }
-
-   embedAugmentData(result: any, parentStoreData: any): void {
-      let array = this.arrayAccessor.get(parentStoreData);
-      if (!isArray(array)) return;
-      if (!this.hasNestedAliases) {
-         result[this.recordAlias] = array[this.itemIndex];
-         result[this.indexAlias] = this.itemIndex;
-         result[this.lengthAlias] = array.length;
-      } else {
-         let copy = result;
-         copy = this.recordBinding.set(copy, array[this.itemIndex]);
-         copy = this.indexBinding.set(copy, this.itemIndex);
-         copy = this.lengthBinding.set(copy, array.length);
-         result[this.recordBinding.parts[0]] = copy[this.recordBinding.parts[0]];
-         result[this.indexBinding.parts[0]] = copy[this.indexBinding.parts[0]];
-         result[this.lengthBinding.parts[0]] = copy[this.lengthBinding.parts[0]];
-      }
-   }
-
-   setIndex(itemIndex: number): void {
-      this.itemIndex = itemIndex;
-   }
-}
-
-ArrayElementView.prototype.recordAlias = "$record";
-ArrayElementView.prototype.indexAlias = "$index";
-ArrayElementView.prototype.lengthAlias = "$length";
+import { AugmentedViewBase } from "./AugmentedViewBase";
+import { isArray } from "../util/isArray";
+import { Binding } from "./Binding";
+import { View } from "./View";
+
+export interface ArrayElementViewConfig {
+   store: View;
+   arrayAccessor: any;
+   immutable?: boolean;
+   recordAlias?: string;
+   indexAlias?: string;
+   lengthAlias?: string;
+   hasNestedAliases?: boolean;
+   recordBinding?: any;
+   indexBinding?: any;
+   lengthBinding?: any;
+   itemIndex: number;
+   sealed?: boolean;
+}
+
+export class ArrayElementView extends AugmentedViewBase {
+   declare arrayAccessor: any;
+   declare recordAlias: string;
+   declare indexAlias: string;
+   declare lengthAlias: string;
+   declare hasNestedAliases?: boolean;
+   declare recordBinding?: any;
+   declare indexBinding?: any;
+   declare lengthBinding?: any;
+   declare itemIndex: number;
+
+   constructor(config: ArrayElementViewConfig) {
+      super(config);
+      this.hasNestedAliases =
+         this.recordAlias.indexOf(".") >= 0 || this.indexAlias.indexOf(".") >= 0 || this.lengthAlias.indexOf(".") >= 0;
+      this.recordBinding = Binding.get(this.recordAlias);
+      if (this.hasNestedAliases) {
+         this.indexBinding = Binding.get(this.indexAlias);
+         this.lengthBinding = Binding.get(this.lengthAlias);
+      }
+   }
+
+   getExtraKeyBinding(key: string): any {
+      if (!key.startsWith(this.recordAlias)) return null;
+      if (key.length == this.recordAlias.length || key[this.recordAlias.length] == ".") return this.recordBinding;
+      return null;
+   }
+
+   deleteExtraKeyValue(key: string): boolean {
+      if (key != this.recordAlias) throw new Error(`Field ${key} cannot be deleted.`);
+      const array = this.arrayAccessor.get(this.store.getData());
+      if (!array) return false;
+      const newArray = [...array.slice(0, this.itemIndex), ...array.slice(this.itemIndex + 1)];
+      return this.arrayAccessor.set(newArray, this.store);
+   }
+
+   setExtraKeyValue(key: string, value: any): boolean {
+      if (key != this.recordAlias) throw new Error(`Field ${key} is read-only.`);
+      const array = this.arrayAccessor.get(this.store.getData());
+      if (!array || value === array[this.itemIndex]) return false;
+      const newArray = [...array.slice(0, this.itemIndex), value, ...array.slice(this.itemIndex + 1)];
+      return this.arrayAccessor.set(newArray, this.store);
+   }
+
+   embedAugmentData(result: any, parentStoreData: any): void {
+      let array = this.arrayAccessor.get(parentStoreData);
+      if (!isArray(array)) return;
+      if (!this.hasNestedAliases) {
+         result[this.recordAlias] = array[this.itemIndex];
+         result[this.indexAlias] = this.itemIndex;
+         result[this.lengthAlias] = array.length;
+      } else {
+         let copy = result;
+         copy = this.recordBinding.set(copy, array[this.itemIndex]);
+         copy = this.indexBinding.set(copy, this.itemIndex);
+         copy = this.lengthBinding.set(copy, array.length);
+         result[this.recordBinding.parts[0]] = copy[this.recordBinding.parts[0]];
+         result[this.indexBinding.parts[0]] = copy[this.indexBinding.parts[0]];
+         result[this.lengthBinding.parts[0]] = copy[this.lengthBinding.parts[0]];
+      }
+   }
+
+   setIndex(itemIndex: number): void {
+      this.itemIndex = itemIndex;
+   }
+}
+
+ArrayElementView.prototype.recordAlias = "$record";
+ArrayElementView.prototype.indexAlias = "$index";
+ArrayElementView.prototype.lengthAlias = "$length";