cx 26.0.12 → 26.0.14

package/src/ui/Text.ts

@@ -1,11 +1,30 @@
-import { Widget } from './Widget';
+import { Widget, WidgetConfig } from './Widget';
+import { StringProp } from './Prop';
 
-export class Text extends Widget {
+export interface TextConfig extends WidgetConfig {
+   /** The value to be rendered as text. */
+   value?: StringProp;
+
+   /** Template string for the text value. */
+   tpl?: string;
+
+   /** Expression for the text value. */
+   expr?: string;
+
+   /** Binding path for the text value. */
+   bind?: string;
+}
+
+export class Text extends Widget<TextConfig> {
    declare value?: any;
    declare tpl?: string;
    declare expr?: any;
    declare bind?: string;
 
+   constructor(config?: TextConfig) {
+      super(config);
+   }
+
    init() {
       if (!this.value && (this.tpl || this.expr || this.bind))
          this.value = {

package/src/ui/VDOM.ts

@@ -1,34 +1,34 @@
-// @ts-expect-error
-import { VDOM as vdom } from "cx-react";
-
-import type * as React from "react";
-import type { Component } from "react";
-import type {
-   unstable_batchedUpdates,
-   render,
-   findDOMNode,
-   createPortal,
-   unstable_renderSubtreeIntoContainer,
-   hydrate,
-   unmountComponentAtNode,
-} from "react-dom";
-import type { createRoot, hydrateRoot, Root } from "react-dom/client";
-
-export interface VDOMType extends Omit<typeof React, "default"> {
-   allowRenderOutputCaching?: boolean;
-   Component: typeof Component;
-
-   DOM: {
-      unstable_batchedUpdates: typeof unstable_batchedUpdates;
-      render: typeof render;
-      findDOMNode: typeof findDOMNode;
-      createPortal: typeof createPortal;
-      createRoot: typeof createRoot;
-      hydrateRoot: typeof hydrateRoot;
-      hydrate: typeof hydrate;
-      unmountComponentAtNode: typeof unmountComponentAtNode;
-      unstable_renderSubtreeIntoContainer: typeof unstable_renderSubtreeIntoContainer;
-   };
-}
-
-export const VDOM = vdom as VDOMType;
+// @ts-expect-error
+import { VDOM as vdom } from "cx-react";
+
+import type * as React from "react";
+import type { Component } from "react";
+import type {
+   unstable_batchedUpdates,
+   render,
+   findDOMNode,
+   createPortal,
+   unstable_renderSubtreeIntoContainer,
+   hydrate,
+   unmountComponentAtNode,
+} from "react-dom";
+import type { createRoot, hydrateRoot, Root } from "react-dom/client";
+
+export interface VDOMType extends Omit<typeof React, "default"> {
+   allowRenderOutputCaching?: boolean;
+   Component: typeof Component;
+
+   DOM: {
+      unstable_batchedUpdates: typeof unstable_batchedUpdates;
+      render: typeof render;
+      findDOMNode: typeof findDOMNode;
+      createPortal: typeof createPortal;
+      createRoot: typeof createRoot;
+      hydrateRoot: typeof hydrateRoot;
+      hydrate: typeof hydrate;
+      unmountComponentAtNode: typeof unmountComponentAtNode;
+      unstable_renderSubtreeIntoContainer: typeof unstable_renderSubtreeIntoContainer;
+   };
+}
+
+export const VDOM = vdom as VDOMType;

package/src/ui/adapter/ArrayAdapter.spec.ts

@@ -1,55 +1,55 @@
-import { RenderingContext } from "../RenderingContext";
-import { Instance } from "../Instance";
-import { TreeAdapter } from "./TreeAdapter";
-import assert from "assert";
-import { Store } from "../../data";
-import { ArrayAdapter } from "./ArrayAdapter";
-
-describe("ArrayAdapter", () => {
-   it("maps data into records", () => {
-      let adapter = new ArrayAdapter();
-      let data = [
-         {
-            id: 1,
-            text: "1",
-         },
-         {
-            id: 2,
-            text: "2",
-         },
-      ];
-
-      let store = new Store();
-
-      let records = adapter.mapRecords(new RenderingContext(), new Instance(null!, "1", null!, store), data, store);
-
-      assert.equal(records.length, 2);
-      assert.equal(records[0].data, records[0].store.get("$record"));
-      assert.equal(records[1].data, records[1].store.get("$record"));
-   });
-
-   it("can sort data", () => {
-      let adapter = new ArrayAdapter();
-
-      adapter.sort([{ field: "id", direction: "DESC" }]);
-
-      let data = [
-         {
-            id: 1,
-            text: "1",
-         },
-         {
-            id: 2,
-            text: "2",
-         },
-      ];
-
-      let store = new Store();
-
-      let records = adapter.mapRecords(new RenderingContext(), new Instance(null!, "1", null!, store), data, store);
-
-      assert.equal(records.length, 2);
-      assert.equal(data[1], records[0].store.get("$record"));
-      assert.equal(data[0], records[1].store.get("$record"));
-   });
-});
+import { RenderingContext } from "../RenderingContext";
+import { Instance } from "../Instance";
+import { TreeAdapter } from "./TreeAdapter";
+import assert from "assert";
+import { Store } from "../../data";
+import { ArrayAdapter } from "./ArrayAdapter";
+
+describe("ArrayAdapter", () => {
+   it("maps data into records", () => {
+      let adapter = new ArrayAdapter();
+      let data = [
+         {
+            id: 1,
+            text: "1",
+         },
+         {
+            id: 2,
+            text: "2",
+         },
+      ];
+
+      let store = new Store();
+
+      let records = adapter.mapRecords(new RenderingContext(), new Instance(null!, "1", null!, store), data, store);
+
+      assert.equal(records.length, 2);
+      assert.equal(records[0].data, records[0].store.get("$record"));
+      assert.equal(records[1].data, records[1].store.get("$record"));
+   });
+
+   it("can sort data", () => {
+      let adapter = new ArrayAdapter();
+
+      adapter.sort([{ field: "id", direction: "DESC" }]);
+
+      let data = [
+         {
+            id: 1,
+            text: "1",
+         },
+         {
+            id: 2,
+            text: "2",
+         },
+      ];
+
+      let store = new Store();
+
+      let records = adapter.mapRecords(new RenderingContext(), new Instance(null!, "1", null!, store), data, store);
+
+      assert.equal(records.length, 2);
+      assert.equal(data[1], records[0].store.get("$record"));
+      assert.equal(data[0], records[1].store.get("$record"));
+   });
+});

package/src/ui/adapter/ArrayAdapter.ts

@@ -152,7 +152,10 @@ export class ArrayAdapter<T = any> extends DataAdapter<T> {
             });
          } else {
             (recordStore as ReadOnlyDataView).setStore(parentStore);
-            (recordStore as ReadOnlyDataView).setData(data);
+            (recordStore as ReadOnlyDataView).setData({
+               [this.recordName]: data,
+               [this.indexName]: index,
+            });
          }
       }
 

package/src/ui/adapter/TreeAdapter.spec.ts

@@ -1,76 +1,76 @@
-import { RenderingContext } from "../RenderingContext";
-import { Instance } from "../Instance";
-import { TreeAdapter } from "./TreeAdapter";
-import assert from "assert";
-import { Store } from "../../data";
-
-describe("TreeAdapter", () => {
-   it("properly expands records", () => {
-      let tree = new TreeAdapter({
-         childrenField: "children",
-         expandedField: "expanded",
-      });
-
-      let data = [
-         {
-            id: 1,
-            text: "1",
-            expanded: false,
-            children: [
-               {
-                  id: 4,
-                  text: "4",
-               },
-            ],
-         },
-         {
-            id: 2,
-            text: "2",
-            expanded: true,
-            children: [
-               {
-                  id: 3,
-                  text: "3",
-                  expanded: true,
-                  children: [
-                     {
-                        id: 5,
-                        text: "5",
-                        expanded: true,
-                        children: [
-                           {
-                              id: 6,
-                              text: "6",
-                           },
-                        ],
-                     },
-                  ],
-               },
-            ],
-         },
-         {
-            id: 7,
-            text: "7",
-            expanded: false,
-         },
-      ];
-
-      let store = new Store();
-
-      let records = tree.mapRecords(new RenderingContext(), new Instance(null!, "1", null!, store), data, store);
-
-      assert.equal(records.length, 6);
-      assert.equal(records[0].data.id, 1);
-      assert.equal(records[1].data.id, 2);
-      assert.equal(records[2].data.id, 3);
-      assert.equal(records[3].data.id, 5);
-      assert.equal(records[4].data.id, 6);
-      assert.equal(records[5].data.id, 7);
-      assert.equal(records[5].store.get("$record.id"), 7);
-      assert.equal(records[2].store.get("$record.id"), 3);
-      assert.equal(records[3].store.get("$record.id"), 5);
-      assert.equal(records[2].store.get("$record.id"), 3);
-      assert.equal(records[0].store.get("$record.id"), 1);
-      assert.equal(records[1].store.get("$record.id"), 2);
-   });
-});
+import { RenderingContext } from "../RenderingContext";
+import { Instance } from "../Instance";
+import { TreeAdapter } from "./TreeAdapter";
+import assert from "assert";
+import { Store } from "../../data";
+
+describe("TreeAdapter", () => {
+   it("properly expands records", () => {
+      let tree = new TreeAdapter({
+         childrenField: "children",
+         expandedField: "expanded",
+      });
+
+      let data = [
+         {
+            id: 1,
+            text: "1",
+            expanded: false,
+            children: [
+               {
+                  id: 4,
+                  text: "4",
+               },
+            ],
+         },
+         {
+            id: 2,
+            text: "2",
+            expanded: true,
+            children: [
+               {
+                  id: 3,
+                  text: "3",
+                  expanded: true,
+                  children: [
+                     {
+                        id: 5,
+                        text: "5",
+                        expanded: true,
+                        children: [
+                           {
+                              id: 6,
+                              text: "6",
+                           },
+                        ],
+                     },
+                  ],
+               },
+            ],
+         },
+         {
+            id: 7,
+            text: "7",
+            expanded: false,
+         },
+      ];
+
+      let store = new Store();
+
+      let records = tree.mapRecords(new RenderingContext(), new Instance(null!, "1", null!, store), data, store);
+
+      assert.equal(records.length, 6);
+      assert.equal(records[0].data.id, 1);
+      assert.equal(records[1].data.id, 2);
+      assert.equal(records[2].data.id, 3);
+      assert.equal(records[3].data.id, 5);
+      assert.equal(records[4].data.id, 6);
+      assert.equal(records[5].data.id, 7);
+      assert.equal(records[5].store.get("$record.id"), 7);
+      assert.equal(records[2].store.get("$record.id"), 3);
+      assert.equal(records[3].store.get("$record.id"), 5);
+      assert.equal(records[2].store.get("$record.id"), 3);
+      assert.equal(records[0].store.get("$record.id"), 1);
+      assert.equal(records[1].store.get("$record.id"), 2);
+   });
+});