@tarojs/plugin-platform-harmony-ets 3.7.0-alpha.27 → 4.0.0-alpha.10

package/dist/runtime-framework/solid/reconciler/props.ts

@@ -5,27 +5,32 @@ import type { Style, TaroElement } from '@tarojs/runtime'
 
 export type Props = Record<string, unknown>
 
+const isHarmony = process.env.TARO_PLATFORM === 'harmony'
+const IS_NON_DIMENSIONAL = /max|aspect|acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i
+
 function isEventName (s: string) {
   return s[0] === 'o' && s[1] === 'n'
 }
 
-const IS_NON_DIMENSIONAL = /max|aspect|acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i
+function isEqual (obj1, obj2) {
+  return JSON.stringify(obj1) === JSON.stringify(obj2)
+}
 
 export function updateProps (dom: TaroElement, oldProps: Props, newProps: Props) {
   const updatePayload = getUpdatePayload(dom, oldProps, newProps)
-  if (updatePayload){
+  if (updatePayload) {
     updatePropsByPayload(dom, oldProps, updatePayload)
   }
 }
 
-export function updatePropsByPayload (dom: TaroElement, oldProps: Props, updatePayload: any[]){
-  for (let i = 0; i < updatePayload.length; i += 2){ // key, value 成对出现
-    const key = updatePayload[i]; const newProp = updatePayload[i+1]; const oldProp = oldProps[key]
+export function updatePropsByPayload (dom: TaroElement, oldProps: Props, updatePayload: any[]) {
+  for (let i = 0; i < updatePayload.length; i += 2) { // key, value 成对出现
+    const key = updatePayload[i]; const newProp = updatePayload[i + 1]; const oldProp = oldProps[key]
     setProperty(dom, key, newProp, oldProp)
   }
 }
 
-export function getUpdatePayload (dom: TaroElement, oldProps: Props, newProps: Props){
+export function getUpdatePayload (dom: TaroElement, oldProps: Props, newProps: Props) {
   let i: string
   let updatePayload: any[] | null = null
 
@@ -59,12 +64,11 @@ function setEvent (dom: TaroElement, name: string, value: unknown, oldValue?: un
 
   const compName = capitalize(toCamelCase(dom.tagName.toLowerCase()))
 
-  if (eventName === 'click' && compName in internalComponents) {
+  if (eventName === 'click' && !isHarmony && compName in internalComponents) {
     eventName = 'tap'
   }
 
   if (isFunction(value)) {
-    const isHarmony = process.env.TARO_PLATFORM === 'harmony'
     if (oldValue) {
       dom.removeEventListener(eventName, oldValue as any, !isHarmony ? false : undefined)
       dom.addEventListener(eventName, value, !isHarmony ? { isCapture, sideEffect: false } : undefined)
@@ -76,19 +80,24 @@ function setEvent (dom: TaroElement, name: string, value: unknown, oldValue?: un
   }
 }
 
-function setStyle (style: Style, key: string, value: string | number) {
-  if (key[0] === '-') {
-    style.setProperty(key, value.toString())
+function setStyle (style: Style, key: string, value: unknown) {
+  if (key[0] === '-' && !isHarmony) {
     // css variables need not further judgment
+    style.setProperty(key, (value as string).toString())
     return
   }
 
-  style[key] =
-    isNumber(value) && IS_NON_DIMENSIONAL.test(key) === false
-      ? convertNumber2PX(value)
-      : value == null
-        ? ''
-        : value
+  if (isHarmony && key.startsWith('_')) {
+    // harmony样式已处理
+    style[key] = value == null ? '' : value
+  } else {
+    style[key] =
+      isNumber(value) && IS_NON_DIMENSIONAL.test(key) === false
+        ? convertNumber2PX(value)
+        : value == null
+          ? ''
+          : value
+  }
 }
 
 type StyleValue = Record<string, string | number>
@@ -99,13 +108,9 @@ interface DangerouslySetInnerHTML {
 export function setProperty (dom: TaroElement, name: string, value: unknown, oldValue?: unknown) {
   name = name === 'className' ? 'class' : name
 
-  if (
-    name === 'key' ||
-    name === 'children' ||
-    name === 'ref'
-  ) {
-    // skip
-  } else if (name === 'style') {
+  if (['key', 'children', 'ref'].includes(name)) return
+
+  if (name === 'style') {
     const style = dom.style
     if (isString(value)) {
       style.cssText = value
@@ -118,6 +123,7 @@ export function setProperty (dom: TaroElement, name: string, value: unknown, old
       if (isObject<StyleValue>(oldValue)) {
         for (const i in oldValue) {
           if (!(value && i in (value as StyleValue))) {
+            // harmony设置style，路径设置路径如下：dom.style => cssStyleDeclaration.setProperty => convertWebStyle2HmStyle => dom._st.hmStyle
             setStyle(style, i, '')
           }
         }
@@ -125,12 +131,40 @@ export function setProperty (dom: TaroElement, name: string, value: unknown, old
 
       if (isObject<StyleValue>(value)) {
         for (const i in value) {
-          if (!oldValue || value[i] !== (oldValue as StyleValue)[i]) {
+          if (!oldValue || !isEqual(value[i], (oldValue as StyleValue)[i])) {
             setStyle(style, i, value[i])
           }
         }
       }
     }
+  } else if (name === '__hmStyle') {
+    // 鸿蒙样式特殊处理
+    // @ts-ignore
+    const style = dom._st.hmStyle // __hmStyle是已经被处理过的鸿蒙样式，可以直接塞进hmStyle对象内
+    if (isObject<StyleValue>(oldValue)) {
+      for (const i in oldValue) {
+        if (!(value && i in (value as StyleValue))) {
+          // 鸿蒙伪类特殊处理
+          if (isHarmony && (i === '::after' || i === '::before')) {
+            setPseudo(dom, i, null)
+          } else {
+            style[i] = ''
+          }
+        }
+      }
+    }
+    if (isObject<StyleValue>(value)) {
+      for (const i in value) {
+        if (!oldValue || !isEqual(value[i], (oldValue as StyleValue)[i])) {
+          // 鸿蒙伪类特殊处理
+          if (isHarmony && (i === '::after' || i === '::before')) {
+            setPseudo(dom, i, value[i] as unknown as StyleValue)
+          } else {
+            style[i] = value[i]
+          }
+        }
+      }
+    }
   } else if (isEventName(name)) {
     setEvent(dom, name, value, oldValue)
   } else if (name === 'dangerouslySetInnerHTML') {
@@ -149,3 +183,14 @@ export function setProperty (dom: TaroElement, name: string, value: unknown, old
     }
   }
 }
+
+// 设置鸿蒙伪类属性(特殊设置)
+function setPseudo(dom: TaroElement, name: '::after' | '::before', value: StyleValue | null) {
+  if (name === '::after') {
+    // @ts-ignore
+    dom.set_pseudo_after(value)
+  } else if (name === '::before') {
+    // @ts-ignore
+    dom.set_pseudo_before(value)
+  }
+}

package/dist/runtime-framework/solid/reconciler/render.ts

@@ -1,5 +1,7 @@
-import TaroText from '@tarojs/components/text'
+// @ts-ignore
+import { TaroText } from '@tarojs/components'
 import { document } from '@tarojs/runtime'
+import { isFunction, isString } from '@tarojs/shared'
 import { createRenderer } from 'solid-js/universal'
 
 import { h } from './h'
@@ -46,11 +48,10 @@ const renderer = createRenderer<TaroNode>({
 export const render = renderer.render
 export const effect = renderer.effect
 export const memo = renderer.memo
-export const createComponent = (type, props) => {
-  if (typeof type === 'string') {
-    return h(type, props)
-  }
-  return renderer.createComponent(type, props)
+export const createComponent = (type, props?) => {
+  if (isString(type)) return h(type, props)
+  if (isFunction(type)) return renderer.createComponent(type, props)
+  return renderer.createComponent(Fragment, props)
 }
 export const createElement = renderer.createElement
 export const createTextNode = renderer.createTextNode
@@ -59,3 +60,12 @@ export const insert = renderer.insert
 export const spread = renderer.spread
 export const setProp = renderer.setProp
 export const mergeProps = renderer.mergeProps
+
+function Fragment(props) {
+  return props.children
+}
+function jsx(type, props) {
+  return createComponent(type, props)
+}
+
+export { Fragment, jsx, jsx as jsxDEV, jsx as jsxs }

package/dist/runtime-framework/solid/reconciler/use.ts

@@ -5,4 +5,3 @@ export function use(fn, ele, accessor) {
     fn(ele, accessor)
   })
 }
-

package/dist/runtime-framework/solid/utils/index.ts

@@ -45,5 +45,3 @@ export function setRouterParams(options) {
     ...options,
   }
 }
-
-