@routevn/creator-model 1.12.0 → 1.12.1

package/README.md

@@ -294,6 +294,10 @@ Current animation update tween properties support either:
 - `keyframes`
 - `auto: { duration, easing }`
 
+Transition animation `mask` accepts one mask object or a non-empty ordered
+array. Each mask may define a non-negative safe-integer `delay` in
+milliseconds.
+
 ## Current Scope
 
 Currently implemented command types:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@routevn/creator-model",
-  "version": "1.12.0",
+  "version": "1.12.1",
   "private": false,
   "type": "module",
   "license": "MIT",

package/src/model.js

@@ -1930,6 +1930,7 @@ const validateMaskDefinition = ({ mask, path, errorFactory }) => {
         "softness",
         "invert",
         "sample",
+        "delay",
         "progress",
         "progressDuration",
         "progressEasing",
@@ -2108,6 +2109,16 @@ const validateMaskDefinition = ({ mask, path, errorFactory }) => {
     );
   }
 
+  if (
+    mask.delay !== undefined &&
+    (!Number.isSafeInteger(mask.delay) || mask.delay < 0)
+  ) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path}.delay must be a non-negative safe integer when provided`,
+    );
+  }
+
   if (mask.progress !== undefined) {
     {
       const result = validateTweenProperty({
@@ -2171,6 +2182,30 @@ const validateMaskDefinition = ({ mask, path, errorFactory }) => {
   }
 };
 
+const validateAnimationMasks = ({ mask, path, errorFactory }) => {
+  if (!Array.isArray(mask)) {
+    return validateMaskDefinition({ mask, path, errorFactory });
+  }
+
+  if (mask.length === 0) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path} must be a non-empty array when provided`,
+    );
+  }
+
+  for (const [index, maskDefinition] of mask.entries()) {
+    const result = validateMaskDefinition({
+      mask: maskDefinition,
+      path: `${path}[${index}]`,
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+};
+
 const validateAnimationDefinition = ({ animation, path, errorFactory }) => {
   {
     const result = validateAllowedKeys({
@@ -2276,7 +2311,7 @@ const validateAnimationDefinition = ({ animation, path, errorFactory }) => {
 
   if (animation.mask !== undefined) {
     {
-      const result = validateMaskDefinition({
+      const result = validateAnimationMasks({
         mask: animation.mask,
         path: `${path}.mask`,
         errorFactory,
@@ -8119,43 +8154,41 @@ const validateAnimationMaskImageReferences = ({
   details = {},
   errorFactory = createPreconditionValidationError,
 }) => {
-  if (
-    !isPlainObject(animation) ||
-    animation.type !== "transition" ||
-    !isPlainObject(animation.mask)
-  ) {
+  if (!isPlainObject(animation) || animation.type !== "transition") {
     return VALID_RESULT;
   }
 
-  const { mask } = animation;
+  const maskDefinitions = Array.isArray(animation.mask)
+    ? animation.mask.map((mask, index) => ({
+        mask,
+        path: `${path}.mask[${index}]`,
+        fieldPrefix: `mask[${index}].`,
+      }))
+    : isPlainObject(animation.mask)
+      ? [
+          {
+            mask: animation.mask,
+            path: `${path}.mask`,
+            fieldPrefix: "",
+          },
+        ]
+      : [];
 
-  if (mask.imageId !== undefined) {
-    const result = validateImageReference({
-      state,
-      imageId: mask.imageId,
-      path: `${path}.mask.imageId`,
-      details: {
-        ...details,
-        field: "imageId",
-        imageId: mask.imageId,
-      },
-      errorFactory,
-    });
-    if (!result.valid) {
-      return result;
+  for (const maskDefinition of maskDefinitions) {
+    const { mask, path: maskPath, fieldPrefix } = maskDefinition;
+    if (!isPlainObject(mask)) {
+      continue;
     }
-  }
 
-  if (Array.isArray(mask.imageIds)) {
-    for (const [index, imageId] of mask.imageIds.entries()) {
+    if (mask.imageId !== undefined) {
       const result = validateImageReference({
         state,
-        imageId,
-        path: `${path}.mask.imageIds[${index}]`,
+        imageId: mask.imageId,
+        path: `${maskPath}.imageId`,
         details: {
           ...details,
-          field: `imageIds[${index}]`,
-          imageId,
+          field: `${fieldPrefix}imageId`,
+          imageId: mask.imageId,
         },
         errorFactory,
       });
@@ -8163,27 +8196,46 @@ const validateAnimationMaskImageReferences = ({
         return result;
       }
     }
-  }
 
-  if (Array.isArray(mask.items)) {
-    for (const [index, item] of mask.items.entries()) {
-      if (item?.imageId === undefined) {
-        continue;
+    if (Array.isArray(mask.imageIds)) {
+      for (const [index, imageId] of mask.imageIds.entries()) {
+        const result = validateImageReference({
+          state,
+          imageId,
+          path: `${maskPath}.imageIds[${index}]`,
+          details: {
+            ...details,
+            field: `${fieldPrefix}imageIds[${index}]`,
+            imageId,
+          },
+          errorFactory,
+        });
+        if (!result.valid) {
+          return result;
+        }
       }
+    }
 
-      const result = validateImageReference({
-        state,
-        imageId: item.imageId,
-        path: `${path}.mask.items[${index}].imageId`,
-        details: {
-          ...details,
-          field: `items[${index}].imageId`,
+    if (Array.isArray(mask.items)) {
+      for (const [index, item] of mask.items.entries()) {
+        if (item?.imageId === undefined) {
+          continue;
+        }
+
+        const result = validateImageReference({
+          state,
           imageId: item.imageId,
-        },
-        errorFactory,
-      });
-      if (!result.valid) {
-        return result;
+          path: `${maskPath}.items[${index}].imageId`,
+          details: {
+            ...details,
+            field: `${fieldPrefix}items[${index}].imageId`,
+            imageId: item.imageId,
+          },
+          errorFactory,
+        });
+        if (!result.valid) {
+          return result;
+        }
       }
     }
   }