@tarojs/plugin-platform-harmony-ets 4.0.0-beta.17 → 4.0.0-beta.19

package/dist/runtime-ets/dom/cssNesting.ts

@@ -68,7 +68,7 @@ function depthTraversal(root: ReactElement) {
 
   const traverse = (tree) => {
     const result: Record<string, TMapping> = {}
-    if (tree && tree.props && (typeof tree.type === 'string')) {
+    if (tree && tree.props) {
       // 后代选择器
       const descendant_map = {
         children: {},
@@ -115,6 +115,14 @@ function depthTraversal(root: ReactElement) {
 
   const processLeaf = (leaf, descendant_map: TMappingNode) => {
     if (!leaf) return
+
+    // 如果是个数组
+    if (leaf instanceof Array) {
+      for (let i = 0; i < leaf.length; i++) {
+        processLeaf(leaf[i], descendant_map)
+      }
+    }
+
     const leaf_map = traverse(leaf)
     if (!leaf_map) return
     // 直接后代
@@ -125,7 +133,7 @@ function depthTraversal(root: ReactElement) {
     for (let i = 0; i < keys.length; i++) {
       const leaf_child_map = class_mapping[keys[i]]
       if (leaf_child_map) {
-        Object.assign(descendant_map.descendants, leaf_child_map.children)
+        Object.assign(descendant_map.descendants, leaf_child_map.descendants)
       }
     }
   }
@@ -180,44 +188,23 @@ function combineStyle(nestingStyle: NestingStyle, class_mapping: TMapping, alias
       return []
     }
   }
-  // 合并样式
-  nestingStyle.forEach(({ selectors, declaration }) => {
-    // 获取选中的节点列表
-    const selectors_elements = findSelector(selectors, class_mapping)
-    for (let i = 0; i < selectors_elements.length; i++) {
-      let ele = selectors_elements[i].node
-      if (ele) {
-        if (ele.props.style) {
-          Object.assign(ele.props.style, declaration)
-        } else {
-          if (process.env.NODE_ENV !== 'production') {
-            // Dev环境的ReactElement会frozen，所以需要重新拷贝格新的对象，生产环境不会有该问题
-            if (Object.isFrozen(ele)) {
-              ele = unfreeze(ele)
-              selectors_elements[i].node = ele
-            }
+  if (nestingStyle && nestingStyle instanceof Array) {
+    // 合并样式
+    nestingStyle.forEach(({ selectors, declaration }) => {
+      // 获取选中的节点列表
+      const selectors_elements = findSelector(selectors, class_mapping)
+      for (let i = 0; i < selectors_elements.length; i++) {
+        const ele = selectors_elements[i].node
+        if (ele) {
+          if (ele.props.style) {
+            Object.assign(ele.props.style, declaration)
+          } else {
+            ele.props.style = declaration
           }
-          ele.props.style = declaration
         }
       }
-    }
-  })
-}
-
-// dev模式下解冻props，使其可以对props进行操作
-function unfreeze(object) {
-  const oo: any = {}
-  Object.keys(object).forEach(property => {
-    if (property === 'props') {
-      oo.props = {
-        ...object.props,
-        style: {}
-      }
-    } else {
-      oo[property] = object[property]
-    }
-  })
-  return oo
+    })
+  }
 }
 
 // 合并嵌套样式

package/dist/runtime-ets/dom/element/element.ts

@@ -174,11 +174,7 @@ export class TaroElement<T extends StandardProps = StandardProps> extends TaroNo
 
   // 伪类，不存在style动态设置，均已被转换为鸿蒙样式
   // TODO：可根据实际情况，迁移到具体的组件中，如View、ScrollView中，Text\Image其实是不需要的
-  public _pseudo_before: StyleSheet | null
-
-  public get pseudo_before () {
-    return this._pseudo_before?.hmStyle
-  }
+  public _pseudo_before: StyleSheet | null = null
 
   public set_pseudo_before (value: HarmonyStyle | null) {
     if (value) {
@@ -193,11 +189,7 @@ export class TaroElement<T extends StandardProps = StandardProps> extends TaroNo
     }
   }
 
-  public _pseudo_after: StyleSheet | null
-
-  public get pseudo_after () {
-    return this._pseudo_after?.hmStyle
-  }
+  public _pseudo_after: StyleSheet | null = null
 
   public set_pseudo_after (value: HarmonyStyle | null) {
     if (value) {

package/dist/runtime-ets/dom/stylesheet/covertWeb2Hm.ts

@@ -70,6 +70,7 @@ export const WEB_STYLE_MAP = {
   fontWeight: ['_fontWeight'],
   fontStyle: ['_fontStyle'],
   textAlign: ['_textAlign'],
+  verticalAlign: ['_align'],
   lineHeight: ['_lineHeight'],
   letterSpacing: ['_letterSpacing'],
   textDecoration: ['_textDecoration'],
@@ -419,6 +420,24 @@ export default function convertWebStyle2HmStyle(webStyle: CSSProperties) {
         }
         break
       }
+      case 'verticalAlign': {
+        switch (value) {
+          case 'supper':
+          case 'top':
+          case 'text-top':
+            hmStyle._align = Alignment.Top
+            break
+          case 'middle':
+            hmStyle._align = Alignment.Center
+            break
+          case 'sub':
+          case 'text-bottom':
+          case 'bottom':
+            hmStyle._align = Alignment.Bottom
+            break
+        }
+        break
+      }
       case 'lineHeight': {
         hmStyle._lineHeight = getUnit(value)
         break

package/dist/runtime-ets/dom/stylesheet/index.ts

@@ -578,6 +578,19 @@ export default class StyleSheet {
     this.hmStyle.textAlign = value
   }
 
+  get verticalAlign() {
+    switch (this.hmStyle.verticalAlign) {
+      case Alignment.Center: return 'middle'; break
+      case Alignment.Top: return 'top'; break
+      case Alignment.Bottom: return 'bottom'; break
+      default: return ''
+    }
+  }
+
+  set _align (value: string) {
+    this.hmStyle.verticalAlign = value
+  }
+
   get lineHeight () {
     return this.hmStyle.lineHeight
   }

package/dist/runtime-ets/dom/stylesheet/type.ts

@@ -1,11 +1,13 @@
 // @ts-nocheck
-import matrix4 from '@ohos.matrix4'
+// import matrix4 from '@ohos.matrix4'
 
 export interface HarmonyStyle extends TaroStyleType {
   textAlign?: TextAlign
   textOverflow?: HarmonyType.Overflow
   WebkitLineClamp?: number
   letterSpacing?: number | string
+  verticalAlign?: Alignment
+  lineHeight?: Length
 }
 
 export interface TaroStyleType {
@@ -89,7 +91,6 @@ export interface TaroStyleType {
   fontStyle?: FontStyle
   fontWeight?: number | FontWeight | string
   fontFamily?: string | Resource
-  lineHeight?: string | number | Resource
   textDecoration?: TextDecorationType
 
   // gradient
@@ -108,6 +109,8 @@ export interface TaroTextStyleType {
   textOverflow?: HarmonyType.Overflow
   WebkitLineClamp?: number
   letterSpacing?: number | string
+  verticalAlign?: Alignment
+  lineHeight?: string | number | Resource
 }
 
 export namespace HarmonyType {
@@ -167,6 +170,11 @@ export namespace HarmonyType {
       centerX?: number | string
       centerY?: number | string
     }
-    export type Transform = matrix4.Matrix4Transit
+    // export type Transform = matrix4.Matrix4Transit
+    export type Transform = {
+      Translate?: Translate
+      Scale?: Scale
+      Rotate?: Rotate
+    }
   }
 }

package/dist/runtime-ets/dom/stylesheet/util.ts

@@ -1,5 +1,5 @@
 // @ts-nocheck
-import matrix4 from '@ohos.matrix4'
+// import matrix4 from '@ohos.matrix4'
 import { isNumber } from '@tarojs/shared'
 
 import { convertNumber2VP } from '../../'
@@ -235,16 +235,23 @@ export function getUnit (val) {
 }
 
 export function getTransform(transform) {
+  // if (transform) {
+  //   return transform.reduce((res, item) => {
+  //     switch (item.type) {
+  //       case 'Translate': return res.translate(item.value)
+  //       case 'Scale': return res.scale(item.value)
+  //       case 'Rotate': return res.rotate(item.value)
+  //       case 'Matrix': return res.combine(matrix4.init(item.value))
+  //     }
+  //     return res
+  //   }, matrix4.identity())
+  // }
+  const result = {}
   if (transform) {
-    return transform.reduce((res, item) => {
-      switch (item.type) {
-        case 'Translate': return res.translate(item.value)
-        case 'Scale': return res.scale(item.value)
-        case 'Rotate': return res.rotate(item.value)
-        case 'Matrix': return res.combine(matrix4.init(item.value))
-      }
-      return res
-    }, matrix4.identity())
+    transform.forEach((item) => {
+      result[item.type] = item.value
+    })
+    return result
   }
 }