Merge pull request eleme#113 from hwaphon/fix/20230914_animation_exce…

…ption

fix: animation 动画因用户指定单位导致双单位异常问题

packages/runtime-web/src/components/src/utils/animation.ts

@@ -1,3 +1,4 @@
+import { addUnit } from './unit'
 export const KEY_ANIMATION = 'animation'
 
 const propertyRegex = (key) => new RegExp(key + '\\(([^)]+)\\)', 'i')
@@ -64,7 +65,7 @@ const formateTransformValue = (key, value) => {
     return value
   } else if (isTranslate || isSkew) {
     const unit = isSkew ? 'deg' : 'px'
-    value = value.map((item) => item + unit)
+    value = value.map((item) => addUnit(item, unit))
     return value
   }
 

packages/runtime-web/src/components/src/utils/unit.ts

@@ -0,0 +1,20 @@
+function isNumeric(val: string): boolean {
+  return /^\d+(\.\d+)?$/.test(val)
+}
+
+function isDef<T>(val: T): val is NonNullable<T> {
+  return val !== undefined && val !== null
+}
+
+export function addUnit(
+  value: string | number,
+  unit = 'px'
+): string | undefined {
+  if (!isDef(value)) {
+    return undefined
+  }
+
+  // eslint-disable-next-line no-param-reassign
+  value = String(value)
+  return isNumeric(value) ? `${value}${unit}` : value
+}