@player-ui/player 0.4.0-next.7 → 0.4.0-next.9

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@player-ui/player",
-  "version": "0.4.0-next.7",
+  "version": "0.4.0-next.9",
   "private": false,
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
   "peerDependencies": {},
   "dependencies": {
-    "@player-ui/partial-match-registry": "0.4.0-next.7",
-    "@player-ui/types": "0.4.0-next.7",
+    "@player-ui/partial-match-registry": "0.4.0-next.9",
+    "@player-ui/types": "0.4.0-next.9",
     "dequal": "^2.0.2",
     "p-defer": "^3.0.0",
     "queue-microtask": "^1.2.3",
@@ -64,6 +64,14 @@
     {
       "name": "Kelly Harrop",
       "url": "https://github.com/kharrop"
+    },
+    {
+      "name": "Alejandro Fimbres",
+      "url": "https://github.com/lexfm"
+    },
+    {
+      "name": "Rafael Campos",
+      "url": "https://github.com/rafbcampos"
     }
   ],
   "bundle": "./dist/player.prod.js"

package/src/binding/binding.ts

@@ -14,6 +14,14 @@ export interface BindingParserOptions {
    * Get the result of evaluating an expression
    */
   evaluate: (exp: string) => any;
+
+  /**
+   * Without readOnly, if a binding such as this is used: arr[key='does not exist'],
+   * then an object with that key will be created.
+   * This is done to make assignment such as arr[key='abc'].val = 'foo' work smoothly.
+   * Setting readOnly to true will prevent this behavior, avoiding unintended data changes.
+   */
+  readOnly?: boolean;
 }
 
 export type Getter = (path: BindingInstance) => any;

package/src/binding/index.ts

@@ -172,7 +172,7 @@ export class BindingParser {
 
     const updateKeys = Object.keys(updates);
 
-    if (updateKeys.length > 0) {
+    if (!options.readOnly && updateKeys.length > 0) {
       const updateTransaction = updateKeys.map<[BindingInstance, any]>(
         (updatedBinding) => [
           this.parse(updatedBinding),

package/src/controllers/constants/index.ts

@@ -10,7 +10,7 @@ export interface ConstantsProvider {
   addConstants(data: Record<string, any>, namespace: string): void;
 
   /**
-   * Function to retreive constants from the providers store
+   * Function to retrieve constants from the providers store
    *  - @param key Key used for the store access
    *  - @param namespace namespace values were loaded under (defined in the plugin)
    *  - @param fallback Optional - if key doesn't exist in namespace what to return (will return unknown if not provided)
@@ -77,9 +77,13 @@ export class ConstantsController implements ConstantsProvider {
     }
   }
 
-  clearTemporaryValues(): void {
-    this.tempStore.forEach((value: LocalModel) => {
-      value.reset();
-    });
+  clearTemporaryValues(namespace?: string): void {
+    if (namespace) {
+      this.tempStore.get(namespace)?.reset();
+    } else {
+      this.tempStore.forEach((value: LocalModel) => {
+        value.reset();
+      });
+    }
   }
 }

package/src/controllers/data.ts

@@ -25,11 +25,15 @@ export class DataController implements DataModelWithParser<DataModelOptions> {
     resolveDefaultValue: new SyncBailHook<[BindingInstance], any>(),
 
     onDelete: new SyncHook<[any]>(),
+
     onSet: new SyncHook<[BatchSetTransaction]>(),
+
     onGet: new SyncHook<[any, any]>(),
+
     onUpdate: new SyncHook<[Updates, DataModelOptions | undefined]>(),
 
     format: new SyncWaterfallHook<[any, BindingInstance]>(),
+
     deformat: new SyncWaterfallHook<[any, BindingInstance]>(),
 
     serialize: new SyncWaterfallHook<[any]>(),
@@ -119,18 +123,24 @@ export class DataController implements DataModelWithParser<DataModelOptions> {
       (updates, [binding, newVal]) => {
         const oldVal = this.get(binding, { includeInvalid: true });
 
-        if (!dequal(oldVal, newVal)) {
-          updates.push({
-            binding,
-            newValue: newVal,
-            oldValue: oldVal,
-          });
+        const update = {
+          binding,
+          newValue: newVal,
+          oldValue: oldVal,
+        };
+
+        if (dequal(oldVal, newVal)) {
+          this.logger?.debug(
+            `Skipping update for path: ${binding.asString()}. Value was unchanged: ${oldVal}`
+          );
+        } else {
+          updates.push(update);
+
+          this.logger?.debug(
+            `Setting path: ${binding.asString()} from: ${oldVal} to: ${newVal}`
+          );
         }
 
-        this.logger?.debug(
-          `Setting path: ${binding.asString()} from: ${oldVal} to: ${newVal}`
-        );
-
         return updates;
       },
       []
@@ -164,15 +174,17 @@ export class DataController implements DataModelWithParser<DataModelOptions> {
     return result;
   }
 
-  private resolve(binding: BindingLike): BindingInstance {
+  private resolve(binding: BindingLike, readOnly: boolean): BindingInstance {
     return Array.isArray(binding) || typeof binding === 'string'
-      ? this.pathResolver.parse(binding)
+      ? this.pathResolver.parse(binding, { readOnly })
       : binding;
   }
 
   public get(binding: BindingLike, options?: DataModelOptions) {
     const resolved =
-      binding instanceof BindingInstance ? binding : this.resolve(binding);
+      binding instanceof BindingInstance
+        ? binding
+        : this.resolve(binding, true);
     let result = this.getModel().get(resolved, options);
 
     if (result === undefined && !options?.ignoreDefaultValue) {
@@ -185,6 +197,8 @@ export class DataController implements DataModelWithParser<DataModelOptions> {
 
     if (options?.formatted) {
       result = this.hooks.format.call(result, resolved);
+    } else if (options?.formatted === false) {
+      result = this.hooks.deformat.call(result, resolved);
     }
 
     this.hooks.onGet.call(binding, result);
@@ -192,53 +206,36 @@ export class DataController implements DataModelWithParser<DataModelOptions> {
     return result;
   }
 
-  public delete(binding: BindingLike) {
-    if (binding === undefined || binding === null) {
-      throw new Error(`Invalid arguments: delete expects a data path (string)`);
+  public delete(binding: BindingLike, options?: DataModelOptions) {
+    if (
+      typeof binding !== 'string' &&
+      !Array.isArray(binding) &&
+      !(binding instanceof BindingInstance)
+    ) {
+      throw new Error('Invalid arguments: delete expects a data path (string)');
     }
 
-    const resolved = this.resolve(binding);
-    this.hooks.onDelete.call(resolved);
-    this.deleteData(resolved);
-  }
-
-  public getTrash(): Set<BindingInstance> {
-    return this.trash;
-  }
-
-  private addToTrash(binding: BindingInstance) {
-    this.trash.add(binding);
-  }
+    const resolved =
+      binding instanceof BindingInstance
+        ? binding
+        : this.resolve(binding, false);
 
-  private deleteData(binding: BindingInstance) {
-    const parentBinding = binding.parent();
-    const parentPath = parentBinding.asString();
-    const property = binding.key();
+    const parentBinding = resolved.parent();
+    const property = resolved.key();
+    const parentValue = this.get(parentBinding);
 
-    const existedBeforeDelete = Object.prototype.hasOwnProperty.call(
-      this.get(parentBinding),
-      property
-    );
+    const existedBeforeDelete =
+      typeof parentValue === 'object' &&
+      parentValue !== null &&
+      Object.prototype.hasOwnProperty.call(parentValue, property);
 
-    if (property !== undefined) {
-      const parent = parentBinding ? this.get(parentBinding) : undefined;
+    this.getModel().delete(resolved, options);
 
-      // If we're deleting an item in an array, we just splice it out
-      // Don't add it to the trash
-      if (parentPath && Array.isArray(parent)) {
-        if (parent.length > property) {
-          this.set([[parentBinding, removeAt(parent, property as number)]]);
-        }
-      } else if (parentPath && parent[property]) {
-        this.set([[parentBinding, omit(parent, property as string)]]);
-      } else if (!parentPath) {
-        this.getModel().reset(omit(this.get(''), property as string));
-      }
+    if (existedBeforeDelete && !this.get(resolved)) {
+      this.trash.add(resolved);
     }
 
-    if (existedBeforeDelete && !this.get(binding)) {
-      this.addToTrash(binding);
-    }
+    this.hooks.onDelete.call(resolved);
   }
 
   public serialize(): object {

package/src/controllers/flow/controller.ts

@@ -29,6 +29,7 @@ export class FlowController {
     this.start = this.start.bind(this);
     this.run = this.run.bind(this);
     this.transition = this.transition.bind(this);
+    this.addNewFlow = this.addNewFlow.bind(this);
   }
 
   /** Navigate to another state in the state-machine */
@@ -40,20 +41,9 @@ export class FlowController {
     this.current.transition(stateTransition, options);
   }
 
-  private async addNewFlow(flow: FlowInstance) {
+  private addNewFlow(flow: FlowInstance) {
     this.navStack.push(flow);
     this.current = flow;
-    flow.hooks.transition.tap(
-      'flow-controller',
-      async (_oldState, newState: NamedState) => {
-        if (newState.value.state_type === 'FLOW') {
-          this.log?.debug(`Got FLOW state. Loading flow ${newState.value.ref}`);
-          const endState = await this.run(newState.value.ref);
-          this.log?.debug(`Flow ended. Using outcome: ${endState.outcome}`);
-          flow.transition(endState.outcome);
-        }
-      }
-    );
     this.hooks.flow.call(flow);
   }
 
@@ -74,6 +64,20 @@ export class FlowController {
 
     const flow = new FlowInstance(startState, startFlow, { logger: this.log });
     this.addNewFlow(flow);
+
+    flow.hooks.afterTransition.tap('flow-controller', (flowInstance) => {
+      if (flowInstance.currentState?.value.state_type === 'FLOW') {
+        const subflowId = flowInstance.currentState?.value.ref;
+        this.log?.debug(`Loading subflow ${subflowId}`);
+        this.run(subflowId).then((subFlowEndState) => {
+          this.log?.debug(
+            `Subflow ended. Using outcome: ${subFlowEndState.outcome}`
+          );
+          flowInstance.transition(subFlowEndState?.outcome);
+        });
+      }
+    });
+
     const end = await flow.start();
     this.navStack.pop();
 

package/src/controllers/flow/flow.ts

@@ -58,6 +58,9 @@ export class FlowInstance {
 
     /** A callback when a transition from 1 state to another was made */
     transition: new SyncHook<[NamedState | undefined, NamedState]>(),
+
+    /** A callback to run actions after a transition occurs */
+    afterTransition: new SyncHook<[FlowInstance]>(),
   };
 
   constructor(
@@ -131,7 +134,7 @@ export class FlowInstance {
 
       if (skipTransition) {
         this.log?.debug(
-          `Skipping transition from ${this.currentState} b/c hook told us to`
+          `Skipping transition from ${this.currentState.name} b/c hook told us to`
         );
         return;
       }
@@ -201,5 +204,7 @@ export class FlowInstance {
     this.hooks.transition.call(prevState, {
       ...newCurrentState,
     });
+
+    this.hooks.afterTransition.call(this);
   }
 }

package/src/controllers/validation/binding-tracker.ts

@@ -13,6 +13,9 @@ const CONTEXT = 'validation-binding-tracker';
 export interface BindingTracker {
   /** Get the bindings currently being tracked for validation */
   getBindings(): Set<BindingInstance>;
+
+  /** Add a binding to the tracked set */
+  trackBinding(binding: BindingInstance): void;
 }
 interface Options {
   /** Parse a binding from a view */
@@ -42,6 +45,16 @@ export class ValidationBindingTrackerViewPlugin
     return this.trackedBindings;
   }
 
+  /** Add a binding to the tracked set */
+  trackBinding(binding: BindingInstance) {
+    if (this.trackedBindings.has(binding)) {
+      return;
+    }
+
+    this.trackedBindings.add(binding);
+    this.options.callbacks?.onAdd?.(binding);
+  }
+
   /** Attach hooks to the given resolver */
   applyResolver(resolver: Resolver) {
     this.trackedBindings.clear();
@@ -52,9 +65,6 @@ export class ValidationBindingTrackerViewPlugin
     /** Each Node is a registered section or page that maps to a set of nodes in its section */
     const sections = new Map<Node.Node, Set<Node.Node>>();
 
-    /** Keep track of all seen bindings so we can notify people when we hit one for the first time */
-    const seenBindings = new Set<BindingInstance>();
-
     let lastViewUpdateChangeSet: Set<BindingInstance> | undefined;
 
     const nodeTree = new Map<Node.Node, Set<Node.Node>>();
@@ -129,10 +139,8 @@ export class ValidationBindingTrackerViewPlugin
           }
         }
 
-        if (!seenBindings.has(parsed)) {
-          seenBindings.add(parsed);
-          this.options.callbacks?.onAdd?.(parsed);
-        }
+        this.trackedBindings.add(parsed);
+        this.options.callbacks?.onAdd?.(parsed);
       };
 
       return {
@@ -144,23 +152,36 @@ export class ValidationBindingTrackerViewPlugin
               track(binding);
             }
 
-            const eow = options.validation?._getValidationForBinding(binding);
+            const eows = options.validation
+              ?._getValidationForBinding(binding)
+              ?.getAll(getOptions);
+
+            const firstFieldEOW = eows?.find(
+              (eow) =>
+                eow.displayTarget === 'field' || eow.displayTarget === undefined
+            );
 
-            if (
-              eow?.displayTarget === undefined ||
-              eow?.displayTarget === 'field'
-            ) {
-              return eow;
+            return firstFieldEOW;
+          },
+          getValidationsForBinding(binding, getOptions) {
+            if (getOptions?.track) {
+              track(binding);
             }
 
-            return undefined;
+            return (
+              options.validation
+                ?._getValidationForBinding(binding)
+                ?.getAll(getOptions) ?? []
+            );
           },
-          getChildren: (type: Validation.DisplayTarget) => {
+          getChildren: (type?: Validation.DisplayTarget) => {
             const validations = new Array<ValidationResponse>();
             lastComputedBindingTree.get(node)?.forEach((binding) => {
-              const eow = options.validation?._getValidationForBinding(binding);
+              const eow = options.validation
+                ?._getValidationForBinding(binding)
+                ?.get();
 
-              if (eow && type === eow.displayTarget) {
+              if (eow && (type === undefined || type === eow.displayTarget)) {
                 validations.push(eow);
               }
             });
@@ -170,7 +191,9 @@ export class ValidationBindingTrackerViewPlugin
           getValidationsForSection: () => {
             const validations = new Array<ValidationResponse>();
             lastSectionBindingTree.get(node)?.forEach((binding) => {
-              const eow = options.validation?._getValidationForBinding(binding);
+              const eow = options.validation
+                ?._getValidationForBinding(binding)
+                ?.get();
 
               if (eow && eow.displayTarget === 'section') {
                 validations.push(eow);
@@ -213,7 +236,7 @@ export class ValidationBindingTrackerViewPlugin
       }
 
       if (node === resolver.root) {
-        this.trackedBindings = currentBindingTree.get(node) ?? new Set();
+        this.trackedBindings = new Set(currentBindingTree.get(node));
         lastComputedBindingTree = currentBindingTree;
 
         lastSectionBindingTree.clear();