@player-ui/player 0.8.0-next.4 → 0.8.0-next.6

package/src/view/plugins/__tests__/template.test.ts

@@ -4,135 +4,27 @@ import type { DataModelWithParser } from "../../../data";
 import { LocalModel, withParser } from "../../../data";
 import { ExpressionEvaluator } from "../../../expressions";
 import { SchemaController } from "../../../schema";
-import { NodeType } from "../../parser";
 import { Parser } from "../../parser";
 import { ViewInstance } from "../../view";
 import type { Options } from "../options";
-import TemplatePlugin from "../template-plugin";
+import { TemplatePlugin, MultiNodePlugin, AssetPlugin } from "../";
 import { StringResolverPlugin, toNodeResolveOptions } from "../..";
 
 const templateJoinValues = {
-  id: "snippet-of-json",
-  topic: "Snippet",
-  schema: {},
-  data: {
-    forms: {
-      "1099-A": [
-        {
-          description: "Desciption of concept 1099 1",
-          amount: "Help",
-        },
-      ],
-      "1099-B": [
-        {
-          description: "Desciption of concept 1099 2",
-          amount: "Help",
-        },
-      ],
-    },
-  },
+  id: "generated-flow",
   views: [
     {
-      id: "overviewGroup",
-      type: "overviewGroup",
-      metaData: {
-        role: "stateful",
-      },
-      modifiers: [
-        {
-          type: "tag",
-          value: "fancy-header",
-        },
-      ],
-      headers: {
-        label: {
-          asset: {
-            id: "line-of-work-summary-gh-header-label",
-            type: "text",
-            value: "Header",
-          },
-        },
-        values: [
-          {
-            asset: {
-              id: "line-of-work-summary-gh-expenses-simple-header-previous-year",
-              type: "text",
-              value: "Type",
-            },
-          },
-          {
-            asset: {
-              id: "line-of-work-summary-gh-expenses-simple-header-cy",
-              type: "text",
-              value: "2022",
-            },
-          },
-        ],
-      },
+      id: "collection",
+      type: "collection",
       template: [
         {
-          data: "forms.1099-A",
+          data: "foo",
           output: "values",
           value: {
             asset: {
-              id: "overviewItem3",
-              type: "overviewItem",
-              label: {
-                asset: {
-                  id: "overviewItem3-label",
-                  type: "text",
-                  value: "1099-A",
-                },
-              },
-              values: [
-                {
-                  asset: {
-                    id: "overviewItem3-year",
-                    type: "text",
-                    value: "Desciption of concept 1099 1",
-                  },
-                },
-                {
-                  asset: {
-                    id: "loverviewItem3-cy",
-                    type: "text",
-                    value: "4000",
-                  },
-                },
-              ],
-            },
-          },
-        },
-        {
-          data: "forms.1099-B",
-          output: "values",
-          value: {
-            asset: {
-              id: "overviewItem4",
-              type: "overviewItem",
-              label: {
-                asset: {
-                  id: "overviewItem4-label",
-                  type: "text",
-                  value: "1099-B",
-                },
-              },
-              values: [
-                {
-                  asset: {
-                    id: "overviewItem4-year",
-                    type: "text",
-                    value: "Desciption of concept 1099 2",
-                  },
-                },
-                {
-                  asset: {
-                    id: "loverviewItem3-cy",
-                    type: "text",
-                    value: "6000",
-                  },
-                },
-              ],
+              id: "value-_index_",
+              type: "text",
+              value: "item {{foo._index_}}",
             },
           },
         },
@@ -140,238 +32,71 @@ const templateJoinValues = {
       values: [
         {
           asset: {
-            id: "overviewItem1",
-            type: "overviewItem",
-            label: {
-              asset: {
-                id: "overviewItem1-label",
-                type: "text",
-                value: "First Summary",
-              },
-            },
-            values: [
-              {
-                asset: {
-                  id: "overviewItem1-year",
-                  type: "text",
-                  value: "Desciption of year summary 1",
-                },
-              },
-              {
-                asset: {
-                  id: "loverviewItem1-cy",
-                  type: "text",
-                  value: "14000",
-                },
-              },
-            ],
+            id: "value-2",
+            type: "text",
+            value: "First value in the collection",
           },
         },
         {
           asset: {
-            id: "overviewItem2",
-            type: "overviewItem",
-            label: {
-              asset: {
-                id: "overviewItem2-label",
-                type: "text",
-                value: "Second year Summary",
-              },
-            },
-            values: [
-              {
-                asset: {
-                  id: "overviewItem2-year",
-                  type: "text",
-                  value: "Desciption of year summary item 2",
-                },
-              },
-              {
-                asset: {
-                  id: "loverviewItem1-cy",
-                  type: "text",
-                  value: "19000",
-                },
-              },
-            ],
+            id: "value-3",
+            type: "text",
+            value: "Second value in the collection",
           },
         },
       ],
     },
     {
-      id: "overviewGroup",
-      type: "overviewGroup",
-      metaData: {
-        role: "stateful",
-      },
-      modifiers: [
-        {
-          type: "tag",
-          value: "fancy-header",
-        },
-      ],
-      headers: {
-        label: {
-          asset: {
-            id: "line-of-work-summary-gh-header-label",
-            type: "text",
-            value: "Header",
-          },
-        },
-        values: [
-          {
-            asset: {
-              id: "line-of-work-summary-gh-expenses-simple-header-previous-year",
-              type: "text",
-              value: "Type",
-            },
-          },
-          {
-            asset: {
-              id: "line-of-work-summary-gh-expenses-simple-header-cy",
-              type: "text",
-              value: "2022",
-            },
-          },
-        ],
-      },
+      id: "collection",
+      type: "collection",
       values: [
         {
           asset: {
-            id: "overviewItem1",
-            type: "overviewItem",
-            label: {
-              asset: {
-                id: "overviewItem1-label",
-                type: "text",
-                value: "First Summary",
-              },
-            },
-            values: [
-              {
-                asset: {
-                  id: "overviewItem1-year",
-                  type: "text",
-                  value: "Desciption of year summary 1",
-                },
-              },
-              {
-                asset: {
-                  id: "loverviewItem1-cy",
-                  type: "text",
-                  value: "14000",
-                },
-              },
-            ],
+            id: "value-2",
+            type: "text",
+            value: "First value in the collection",
           },
         },
         {
           asset: {
-            id: "overviewItem2",
-            type: "overviewItem",
-            label: {
-              asset: {
-                id: "overviewItem2-label",
-                type: "text",
-                value: "Second year Summary",
-              },
-            },
-            values: [
-              {
-                asset: {
-                  id: "overviewItem2-year",
-                  type: "text",
-                  value: "Desciption of year summary item 2",
-                },
-              },
-              {
-                asset: {
-                  id: "loverviewItem1-cy",
-                  type: "text",
-                  value: "19000",
-                },
-              },
-            ],
+            id: "value-3",
+            type: "text",
+            value: "Second value in the collection",
           },
         },
       ],
       template: [
         {
-          data: "forms.1099-A",
-          output: "values",
-          value: {
-            asset: {
-              id: "overviewItem3",
-              type: "overviewItem",
-              label: {
-                asset: {
-                  id: "overviewItem3-label",
-                  type: "text",
-                  value: "1099-A",
-                },
-              },
-              values: [
-                {
-                  asset: {
-                    id: "overviewItem3-year",
-                    type: "text",
-                    value: "Desciption of concept 1099 1",
-                  },
-                },
-                {
-                  asset: {
-                    id: "loverviewItem3-cy",
-                    type: "text",
-                    value: "4000",
-                  },
-                },
-              ],
-            },
-          },
-        },
-        {
-          data: "forms.1099-B",
+          data: "foo",
           output: "values",
           value: {
             asset: {
-              id: "overviewItem4",
-              type: "overviewItem",
-              label: {
-                asset: {
-                  id: "overviewItem4-label",
-                  type: "text",
-                  value: "1099-B",
-                },
-              },
-              values: [
-                {
-                  asset: {
-                    id: "overviewItem4-year",
-                    type: "text",
-                    value: "Desciption of concept 1099 2",
-                  },
-                },
-                {
-                  asset: {
-                    id: "loverviewItem3-cy",
-                    type: "text",
-                    value: "6000",
-                  },
-                },
-              ],
+              id: "value-_index_",
+              type: "text",
+              value: "item {{foo._index_}}",
             },
           },
         },
       ],
     },
   ],
+  data: {
+    foo: [1, 2],
+  },
   navigation: {
-    BEGIN: "SnippetFlow",
-    SnippetFlow: {
-      startState: "VIEW_Snippet-View1",
-      "VIEW_Snippet-View1": {
-        ref: "overviewGroup",
+    BEGIN: "FLOW_1",
+    FLOW_1: {
+      startState: "VIEW_1",
+      VIEW_1: {
         state_type: "VIEW",
+        ref: "collection",
+        transitions: {
+          "*": "END_Done",
+        },
+      },
+      END_Done: {
+        state_type: "END",
+        outcome: "done",
       },
     },
   },
@@ -401,6 +126,7 @@ describe("templates", () => {
       },
     };
     new TemplatePlugin(options).applyParser(parser);
+    new AssetPlugin().applyParser(parser);
   });
 
   it("works with simple ones", () => {
@@ -459,76 +185,6 @@ describe("templates", () => {
       }),
     ).toMatchSnapshot();
   });
-
-  it("determines if nodeType is template", () => {
-    const nodeTest = "template";
-    const nodeType = parser.hooks.determineNodeType.call(nodeTest);
-    expect(nodeType).toStrictEqual("template");
-  });
-
-  it("Does not return a nodeType", () => {
-    const nodeTest = {
-      value: "foo",
-    };
-    const nodeType = parser.hooks.determineNodeType.call(nodeTest);
-    expect(nodeType).toBe(undefined);
-  });
-
-  it("returns templateNode if template exists", () => {
-    const obj = {
-      dynamic: true,
-      data: "foo.bar",
-      output: "values",
-      value: {
-        value: "{{foo.bar._index_}}",
-      },
-    };
-    const nodeOptions = {
-      templateDepth: 1,
-    };
-    const parsedNode = parser.hooks.parseNode.call(
-      obj,
-      NodeType.Value,
-      nodeOptions,
-      NodeType.Template,
-    );
-    expect(parsedNode).toStrictEqual({
-      data: "foo.bar",
-      depth: 1,
-      dynamic: true,
-      template: {
-        value: "{{foo.bar._index_}}",
-      },
-      type: "template",
-    });
-  });
-
-  it("returns templateNode if template exists, and templateDepth is not set", () => {
-    const obj = {
-      data: "foo.bar2",
-      output: "values",
-      dynamic: true,
-      value: {
-        value: "{{foo.bar2._index_}}",
-      },
-    };
-    const nodeOptions = {};
-    const parsedNode = parser.hooks.parseNode.call(
-      obj,
-      NodeType.Value,
-      nodeOptions,
-      NodeType.Template,
-    );
-    expect(parsedNode).toStrictEqual({
-      data: "foo.bar2",
-      depth: 0,
-      dynamic: true,
-      template: {
-        value: "{{foo.bar2._index_}}",
-      },
-      type: "template",
-    });
-  });
 });
 
 describe("dynamic templates", () => {
@@ -695,13 +351,15 @@ describe("dynamic templates", () => {
       });
 
       const pluginOptions = toNodeResolveOptions(view.resolverOptions);
+      new AssetPlugin().apply(view);
       new TemplatePlugin(pluginOptions).apply(view);
       new StringResolverPlugin().apply(view);
+      new MultiNodePlugin().apply(view);
 
       const resolved = view.update();
 
       expect(resolved.values).toHaveLength(4);
-      expect(resolved.values[0]).toMatchSnapshot();
+      expect(resolved.values).toMatchSnapshot();
     });
     it("Should show template item last when coming after values on lexical order", () => {
       const view = new ViewInstance(templateJoinValues.views[1], {
@@ -712,13 +370,15 @@ describe("dynamic templates", () => {
       });
 
       const pluginOptions = toNodeResolveOptions(view.resolverOptions);
+      new AssetPlugin().apply(view);
       new TemplatePlugin(pluginOptions).apply(view);
       new StringResolverPlugin().apply(view);
+      new MultiNodePlugin().apply(view);
 
       const resolved = view.update();
 
       expect(resolved.values).toHaveLength(4);
-      expect(resolved.values[0]).toMatchSnapshot();
+      expect(resolved.values).toMatchSnapshot();
     });
   });
 });

package/src/view/plugins/applicability.ts

@@ -1,12 +1,21 @@
 import { omit } from "timm";
 import type { Options } from "./options";
 import type { Resolver } from "../resolver";
-import type { Node, ParseObjectOptions, Parser } from "../parser";
+import type {
+  Node,
+  ParseObjectOptions,
+  ParseObjectChildOptions,
+  Parser,
+} from "../parser";
 import { NodeType } from "../parser";
 import { ViewInstance, ViewPlugin } from "../view";
 
 /** A view plugin to remove inapplicable assets from the tree */
 export default class ApplicabilityPlugin implements ViewPlugin {
+  private isApplicability(obj: any) {
+    return obj && Object.prototype.hasOwnProperty.call(obj, "applicability");
+  }
+
   applyResolver(resolver: Resolver) {
     resolver.hooks.beforeResolve.tap(
       "applicability",
@@ -29,43 +38,50 @@ export default class ApplicabilityPlugin implements ViewPlugin {
   }
 
   applyParser(parser: Parser) {
-    /** Switches resolved during the parsing phase are static */
-    parser.hooks.determineNodeType.tap("applicability", (obj: any) => {
-      if (Object.prototype.hasOwnProperty.call(obj, "applicability")) {
-        return NodeType.Applicability;
-      }
-    });
-
     parser.hooks.parseNode.tap(
       "applicability",
       (
         obj: any,
         nodeType: Node.ChildrenTypes,
         options: ParseObjectOptions,
-        determinedNodeType: null | NodeType,
+        childOptions?: ParseObjectChildOptions,
       ) => {
-        if (determinedNodeType === NodeType.Applicability) {
+        if (this.isApplicability(obj)) {
           const parsedApplicability = parser.parseObject(
             omit(obj, "applicability"),
             nodeType,
             options,
           );
-          if (parsedApplicability !== null) {
-            const applicabilityNode = parser.createASTNode(
-              {
-                type: NodeType.Applicability,
-                expression: (obj as any).applicability,
-                value: parsedApplicability,
-              },
-              obj,
-            );
 
-            if (applicabilityNode?.type === NodeType.Applicability) {
-              applicabilityNode.value.parent = applicabilityNode;
-            }
+          if (!parsedApplicability) {
+            return childOptions ? [] : null;
+          }
 
-            return applicabilityNode;
+          const applicabilityNode = parser.createASTNode(
+            {
+              type: NodeType.Applicability,
+              expression: (obj as any).applicability,
+              value: parsedApplicability,
+            },
+            obj,
+          );
+
+          if (!applicabilityNode) {
+            return childOptions ? [] : null;
+          }
+
+          if (applicabilityNode.type === NodeType.Applicability) {
+            applicabilityNode.value.parent = applicabilityNode;
           }
+
+          return childOptions
+            ? [
+                {
+                  path: [...childOptions.path, childOptions.key],
+                  value: applicabilityNode,
+                },
+              ]
+            : applicabilityNode;
         }
       },
     );

package/src/view/plugins/asset.ts

@@ -0,0 +1,42 @@
+import { ViewInstance, ViewPlugin } from "../view";
+import type {
+  Parser,
+  Node,
+  ParseObjectOptions,
+  ParseObjectChildOptions,
+} from "../parser";
+import { NodeType } from "../parser";
+
+/** A view plugin to resolve assets */
+export default class AssetPlugin implements ViewPlugin {
+  applyParser(parser: Parser) {
+    parser.hooks.parseNode.tap(
+      "asset",
+      (
+        obj: any,
+        nodeType: Node.ChildrenTypes,
+        options: ParseObjectOptions,
+        childOptions?: ParseObjectChildOptions,
+      ) => {
+        if (childOptions?.key === "asset" && typeof obj === "object") {
+          const assetAST = parser.parseObject(obj, NodeType.Asset, options);
+
+          if (!assetAST) {
+            return [];
+          }
+
+          return [
+            {
+              path: [...childOptions.path, childOptions.key],
+              value: assetAST,
+            },
+          ];
+        }
+      },
+    );
+  }
+
+  apply(view: ViewInstance) {
+    view.hooks.parser.tap("asset", this.applyParser.bind(this));
+  }
+}

package/src/view/plugins/index.ts

@@ -1,4 +1,6 @@
-export { default as TemplatePlugin } from "./template-plugin";
+export { default as TemplatePlugin } from "./template";
 export { default as StringResolverPlugin } from "./string-resolver";
 export { default as ApplicabilityPlugin } from "./applicability";
 export { default as SwitchPlugin } from "./switch";
+export { default as MultiNodePlugin } from "./multi-node";
+export { default as AssetPlugin } from "./asset";