@mpxjs/core 2.9.69 → 2.9.70-alpha.0

package/@types/global.d.ts

@@ -1,5 +1,5 @@
 // declaration for mpx mode
-declare let __mpx_mode__: 'wx' | 'ali' | 'swan' | 'qq' | 'tt' | 'web' | 'dd' | 'qa' | 'jd'
+declare let __mpx_mode__: 'wx' | 'ali' | 'swan' | 'qq' | 'tt' | 'dd' | 'qa' | 'jd' | 'web' | 'tenon'
 
 // declaration for mpx env
 declare let __mpx_env__: string

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.9.69",
+  "version": "2.9.70-alpha.0",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
@@ -19,15 +19,16 @@
   ],
   "main": "src/index.js",
   "dependencies": {
-    "@mpxjs/utils": "^2.9.69",
+    "@mpxjs/utils": ">=2.9.69-alpha",
     "lodash": "^4.1.1",
     "miniprogram-api-typings": "^3.10.0"
   },
   "peerDependencies": {
     "@ant-design/react-native": "^5.1.3",
     "@d11/react-native-fast-image": "^8.6.12",
-    "@mpxjs/api-proxy": "^2.9.0",
-    "@mpxjs/store": "^2.9.0",
+    "@hummer/tenon-store": "^1.7.0",
+    "@hummer/tenon-vue": "^1.5.1",
+    "@mpxjs/store": ">=2.9.0",
     "@react-navigation/native": "^7.0.3",
     "@react-navigation/stack": "^7.0.4",
     "react": "*",
@@ -105,5 +106,5 @@
     "url": "https://github.com/didi/mpx/issues"
   },
   "sideEffects": false,
-  "gitHead": "e23c51acc4c2ffdd31fcc6c27aae1aed42d1ade2"
+  "gitHead": "2d37697869b9bdda3efab92dda8c910b68fd05c0"
 }

package/src/convertor/convertor.js

@@ -1,11 +1,9 @@
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as aliLifecycle from '../platform/patch/ali/lifecycle'
-import * as webLifecycle from '../platform/patch/web/lifecycle'
-import * as swanLifecycle from '../platform/patch/swan/lifecycle'
+import { LIFECYCLE, lifecycleProxyMap, pageMode } from '../platform/patch/lifecycle/index'
 import { mergeLifecycle } from './mergeLifecycle'
-import { error } from '@mpxjs/utils'
+import { error, extend } from '@mpxjs/utils'
 import wxToAliRule from './wxToAli'
 import wxToWebRule from './wxToWeb'
+import wxToTenonRule from './wxToTenon'
 import wxToSwanRule from './wxToSwan'
 import wxToQqRule from './wxToQq'
 import wxToTtRule from './wxToTt'
@@ -13,24 +11,6 @@ import wxToDdRule from './wxToDd'
 import wxToJdRule from './wxToJd'
 import wxToReactRule from './wxToReact'
 
-// 根据当前环境获取的默认生命周期信息
-let lifecycleInfo
-let pageMode
-
-if (__mpx_mode__ === 'web') {
-  lifecycleInfo = webLifecycle
-  pageMode = ''
-} else if (__mpx_mode__ === 'ali') {
-  lifecycleInfo = aliLifecycle
-  pageMode = ''
-} else if (__mpx_mode__ === 'swan') {
-  lifecycleInfo = swanLifecycle
-  pageMode = 'blend'
-} else {
-  lifecycleInfo = wxLifecycle
-  pageMode = 'blend'
-}
-
 /**
  * 转换规则包含四点
  * lifecycle [object] 生命周期
@@ -40,25 +20,26 @@ if (__mpx_mode__ === 'web') {
  * convert [function] 自定义转换函数, 接收一个options
  */
 const defaultConvertRule = {
-  lifecycle: mergeLifecycle(lifecycleInfo.LIFECYCLE),
-  lifecycleProxyMap: lifecycleInfo.lifecycleProxyMap,
+  lifecycle: mergeLifecycle(LIFECYCLE),
+  lifecycleProxyMap: lifecycleProxyMap,
   pageMode,
   support: !!pageMode,
   convert: null
 }
 
 const rulesMap = {
-  local: { ...defaultConvertRule },
+  local: extend({}, defaultConvertRule),
   default: defaultConvertRule,
   wxToWeb: wxToWebRule,
+  wxToTenon: wxToTenonRule,
   wxToAli: wxToAliRule,
   wxToSwan: wxToSwanRule,
-  wxToQq: { ...defaultConvertRule, ...wxToQqRule },
-  wxToTt: { ...defaultConvertRule, ...wxToTtRule },
-  wxToDd: { ...defaultConvertRule, ...wxToDdRule },
-  wxToJd: { ...defaultConvertRule, ...wxToJdRule },
-  wxToIos: { ...defaultConvertRule, ...wxToReactRule },
-  wxToAndroid: { ...defaultConvertRule, ...wxToReactRule }
+  wxToQq: extend({}, defaultConvertRule, wxToQqRule),
+  wxToTt: extend({}, defaultConvertRule, wxToTtRule),
+  wxToDd: extend({}, defaultConvertRule, wxToDdRule),
+  wxToJd: extend({}, defaultConvertRule, wxToJdRule),
+  wxToIos: extend({}, defaultConvertRule, wxToReactRule),
+  wxToAndroid: extend({}, defaultConvertRule, wxToReactRule)
 }
 
 export function getConvertRule (convertMode) {

package/src/convertor/getConvertMode.js

@@ -1,6 +1,7 @@
 const convertModes = {
   'wx-ali': 'wxToAli',
   'wx-web': 'wxToWeb',
+  'wx-tenon': 'wxToTenon',
   'wx-swan': 'wxToSwan',
   'wx-qq': 'wxToQq',
   'wx-tt': 'wxToTt',

package/src/convertor/wxToAli.js

@@ -1,5 +1,5 @@
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as aliLifecycle from '../platform/patch/ali/lifecycle'
+import * as wxLifecycle from '../platform/patch/lifecycle/index.wx'
+import { LIFECYCLE } from '../platform/patch/lifecycle/index'
 import { mergeLifecycle } from './mergeLifecycle'
 import { error, hasOwn, isDev } from '@mpxjs/utils'
 import { implemented } from '../core/implement'
@@ -38,7 +38,7 @@ function notSupportTip (options) {
 
 export default {
   lifecycle: mergeLifecycle(wxLifecycle.LIFECYCLE),
-  lifecycle2: mergeLifecycle(aliLifecycle.LIFECYCLE),
+  lifecycle2: mergeLifecycle(LIFECYCLE),
   pageMode: 'blend',
   support: false,
   lifecycleProxyMap: wxLifecycle.lifecycleProxyMap,

package/src/convertor/wxToSwan.js

@@ -1,8 +1,8 @@
 import { error, isDev } from '@mpxjs/utils'
 import { implemented } from '../core/implement'
 import { mergeLifecycle } from './mergeLifecycle'
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as swanLifecycle from '../platform/patch/swan/lifecycle'
+import * as wxLifecycle from '../platform/patch/lifecycle/index.wx'
+import { LIFECYCLE } from '../platform/patch/lifecycle/index'
 
 const BEHAVIORS_MAP = {
   'wx://form-field': 'swan://form-field',
@@ -30,7 +30,7 @@ function notSupportTip (options) {
 
 export default {
   lifecycle: mergeLifecycle(wxLifecycle.LIFECYCLE),
-  lifecycle2: mergeLifecycle(swanLifecycle.LIFECYCLE),
+  lifecycle2: mergeLifecycle(LIFECYCLE),
   pageMode: 'blend',
   support: true,
   lifecycleProxyMap: wxLifecycle.lifecycleProxyMap,

package/src/convertor/wxToTenon.js

@@ -0,0 +1,86 @@
+import * as wxLifecycle from '../platform/patch/lifecycle/index.wx'
+import * as tenonLifecycle from '../platform/patch/lifecycle/index.tenon'
+import { mergeLifecycle } from './mergeLifecycle'
+import { error, isObject, diffAndCloneA, hasOwn } from '@mpxjs/utils'
+import { implemented } from '../core/implement'
+import { CREATED, UNMOUNTED } from '../core/innerLifecycle'
+
+// 暂不支持的wx选项，后期需要各种花式支持
+const unsupported = [
+  'moved',
+  'definitionFilter',
+  'onShareAppMessage',
+  'activated',
+  'deactivated',
+  'pageShow',
+  'pageHide',
+  'onPullDownRefresh',
+  'onReachBottom',
+  'onPageScroll',
+  'onTabItemTap',
+  'onResize',
+  'onUnhandledRejection',
+  'onThemeChange'
+]
+
+function convertErrorDesc (key) {
+  error(`Options.${key} is not supported in runtime conversion from wx to tenon.`, global.currentResource)
+}
+
+function notSupportTip (options) {
+  unsupported.forEach(key => {
+    if (options[key]) {
+      if (!implemented[key]) {
+        process.env.NODE_ENV !== 'production' && convertErrorDesc(key)
+        delete options[key]
+      } else if (implemented[key].remove) {
+        delete options[key]
+      }
+    }
+  })
+}
+
+export default {
+  lifecycle: mergeLifecycle(wxLifecycle.LIFECYCLE),
+  lifecycle2: mergeLifecycle(tenonLifecycle.LIFECYCLE),
+  pageMode: 'blend',
+  // support传递为true以将methods外层的方法函数合入methods中
+  support: true,
+  // wx输出tenon时额外将onLoad代理到CREATED
+  lifecycleProxyMap: Object.assign({}, wxLifecycle.lifecycleProxyMap, {
+    [CREATED]: ['created', 'attached', 'onLoad'],
+    [UNMOUNTED]: ['destroyed', 'detached', 'onUnload', 'unmounted']
+  }),
+  convert (options) {
+    const props = Object.assign({}, options.properties, options.props)
+    if (props) {
+      Object.keys(props).forEach(key => {
+        const prop = props[key]
+        if (prop) {
+          if (hasOwn(prop, 'type')) {
+            const newProp = {}
+            if (hasOwn(prop, 'optionalTypes')) {
+              newProp.type = [prop.type, ...prop.optionalTypes]
+            } else {
+              newProp.type = prop.type
+            }
+            if (hasOwn(prop, 'value')) {
+              // vue中对于引用类型数据需要使用函数返回
+              newProp.default = isObject(prop.value)
+                ? function propFn () {
+                  return diffAndCloneA(prop.value).clone
+                }
+                : prop.value
+            }
+            props[key] = newProp
+          } else {
+            props[key] = prop
+          }
+        }
+      })
+      options.props = props
+      delete options.properties
+    }
+    notSupportTip(options)
+  }
+}

package/src/convertor/wxToWeb.js

@@ -1,5 +1,5 @@
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as webLifecycle from '../platform/patch/web/lifecycle'
+import * as wxLifecycle from '../platform/patch/lifecycle/index.wx'
+import { LIFECYCLE } from '../platform/patch/lifecycle/index'
 import { mergeLifecycle } from './mergeLifecycle'
 import {
   isObject,
@@ -32,7 +32,7 @@ function notSupportTip (options) {
 
 export default {
   lifecycle: mergeLifecycle(wxLifecycle.LIFECYCLE),
-  lifecycle2: mergeLifecycle(webLifecycle.LIFECYCLE),
+  lifecycle2: mergeLifecycle(LIFECYCLE),
   pageMode: 'blend',
   support: true,
   lifecycleProxyMap: wxLifecycle.lifecycleProxyMap,

package/src/core/proxy.js

@@ -1,4 +1,4 @@
-import { reactive } from '../observer/reactive'
+import { reactive, shallowReactive } from '../observer/reactive'
 import { ReactiveEffect, pauseTracking, resetTracking } from '../observer/effect'
 import { effectScope } from '../platform/export/index'
 import { watch } from '../observer/watch'
@@ -14,6 +14,8 @@ import {
   isEmptyObject,
   isPlainObject,
   isWeb,
+  isReact,
+  isTenon,
   doGetByPath,
   getByPath,
   setByPath,
@@ -116,7 +118,7 @@ export default class MpxProxy {
     this.ignoreProxyMap = makeMap(Mpx.config.ignoreProxyWhiteList)
     // 收集setup中动态注册的hooks，小程序与web环境都需要
     this.hooks = {}
-    if (__mpx_mode__ !== 'web') {
+    if (!isWeb && !isTenon) {
       this.scope = effectScope(true)
       // props响应式数据代理
       this.props = {}
@@ -134,8 +136,12 @@ export default class MpxProxy {
       this.forceUpdateAll = false
       this.currentRenderTask = null
       this.propsUpdatedFlag = false
-      // react专用，正确触发updated钩子
-      this.pendingUpdatedFlag = false
+      if (isReact) {
+        // react专用，正确触发updated钩子
+        this.pendingUpdatedFlag = false
+        this.memoVersion = Symbol()
+        this.finalMemoVersion = Symbol()
+      }
     }
     this.initApi()
   }
@@ -160,7 +166,7 @@ export default class MpxProxy {
       // 缓存上下文，在 destoryed 阶段删除
       contextMap.set(this.uid, this.target)
     }
-    if (__mpx_mode__ !== 'web') {
+    if (!isWeb && !isTenon) {
       // web中BEFORECREATE钩子通过vue的beforeCreate钩子单独驱动
       this.callHook(BEFORECREATE)
       setCurrentInstance(this)
@@ -179,7 +185,7 @@ export default class MpxProxy {
     this.state = CREATED
     this.callHook(CREATED)
 
-    if (__mpx_mode__ !== 'web' && __mpx_mode__ !== 'ios' && __mpx_mode__ !== 'android') {
+    if (!isWeb && !isReact && !isTenon) {
       this.initRender()
     }
 
@@ -272,7 +278,7 @@ export default class MpxProxy {
     }
     // 挂载$rawOptions
     this.target.$rawOptions = this.options
-    if (__mpx_mode__ !== 'web') {
+    if (!isWeb && !isTenon) {
       // 挂载$watch
       this.target.$watch = this.watch.bind(this)
       // 强制执行render
@@ -282,13 +288,14 @@ export default class MpxProxy {
   }
 
   initProps () {
-    if (__mpx_mode__ === 'ios' || __mpx_mode__ === 'android') {
+    if (isReact) {
       // react模式下props内部对象透传无需深clone，依赖对象深层的数据响应触发子组件更新
       this.props = this.target.__getProps()
+      shallowReactive(this.processIgnoreReactive(this.props))
     } else {
       this.props = diffAndCloneA(this.target.__getProps(this.options)).clone
+      reactive(this.processIgnoreReactive(this.props))
     }
-    reactive(this.processIgnoreReactive(this.props))
     proxy(this.target, this.props, undefined, false, this.createProxyConflictHandler('props'))
   }
 
@@ -562,7 +569,7 @@ export default class MpxProxy {
           }
           if (!processed) {
             // 如果当前数据和上次的miniRenderData完全无关，但存在于组件的视图数据中，则与组件视图数据进行diff
-            if (this.target.data && hasOwn(this.target.data, firstKey)) {
+            if (hasOwn(this.target.data, firstKey)) {
               const localInitialData = getByPath(this.target.data, key)
               const { clone, diff, diffData } = diffAndCloneA(data, localInitialData)
               this.miniRenderData[key] = clone
@@ -760,7 +767,7 @@ export default class MpxProxy {
       this.forceUpdateAll = true
     }
 
-    if (__mpx_mode__ === 'ios' || __mpx_mode__ === 'android') {
+    if (isReact) {
       // rn中不需要setdata
       this.forceUpdateData = {}
       this.forceUpdateAll = false

package/src/dynamic/dynamicRenderMixin.js

@@ -1,4 +1,4 @@
-import { hasOwn, isObject, error } from '@mpxjs/utils'
+import { hasOwn, error } from '@mpxjs/utils'
 import genVnodeTree from './vnode/render'
 import contextMap from './vnode/context'
 import { CREATED } from '../core/innerLifecycle'
@@ -56,7 +56,7 @@ function dynamicRenderHelperMixin () {
     methods: {
       _g (astData, moduleId) {
         const location = this.__mpxProxy && this.__mpxProxy.options.mpxFileResource
-        if (astData && isObject(astData) && hasOwn(astData, 'template')) {
+        if (hasOwn(astData, 'template')) {
           const vnodeTree = genVnodeTree(astData, [this], { moduleId, location })
           return vnodeTree
         } else {

package/src/external/vue.tenon.js

@@ -0,0 +1,13 @@
+import {
+  reactive,
+  computed,
+  toRaw,
+  watch
+} from '@hummer/tenon-vue'
+
+export default {
+  reactive,
+  computed,
+  toRaw,
+  watch
+}

package/src/index.js

@@ -124,7 +124,7 @@ function factory () {
   Object.assign(Mpx, APIs)
   Object.assign(Mpx.prototype, InstanceAPIs)
   // 输出web时在mpx上挂载Vue对象
-  if (__mpx_mode__ === 'web') {
+  if (__mpx_mode__ === 'web' || __mpx_mode__ === 'tenon') {
     Mpx.__vue = Vue
   }
   return Mpx

package/src/observer/reactive.js

@@ -225,7 +225,7 @@ export function shallowReactive (value) {
 }
 
 export function isReactive (value) {
-  return value && hasOwn(value, ObKey) && value[ObKey] instanceof Observer
+  return hasOwn(value, ObKey) && value[ObKey] instanceof Observer
 }
 
 export function getObserver (value) {

package/src/observer/ref.js

@@ -3,12 +3,13 @@ import { RefKey } from '../helper/const'
 import {
   warn,
   isPlainObject,
-  hasOwn
+  hasOwn,
+  extend
 } from '@mpxjs/utils'
 
 export class RefImpl {
   constructor (options) {
-    Object.defineProperty(this, 'value', { enumerable: true, ...options })
+    Object.defineProperty(this, 'value', extend({ enumerable: true }, options))
   }
 }
 

package/src/observer/scheduler.js

@@ -83,6 +83,10 @@ export function queueJob (job) {
   }
 }
 
+export function hasPendingJob (job) {
+  return queue.length && queue.includes(job, isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex)
+}
+
 function queueFlush () {
   if (!isFlushing && !isFlushPending) {
     isFlushPending = true

package/src/observer/watch.js

@@ -12,7 +12,8 @@ import {
   isArray,
   remove,
   callWithErrorHandling,
-  hasChanged
+  hasChanged,
+  extend
 } from '@mpxjs/utils'
 
 export function watchEffect (effect, options) {
@@ -20,11 +21,11 @@ export function watchEffect (effect, options) {
 }
 
 export function watchPostEffect (effect, options) {
-  return watch(effect, null, { ...options, flush: 'post' })
+  return watch(effect, null, extend({}, options, { flush: 'post' }))
 }
 
 export function watchSyncEffect (effect, options) {
-  return watch(effect, null, { ...options, flush: 'sync' })
+  return watch(effect, null, extend({}, options, { flush: 'sync' }))
 }
 
 const warnInvalidSource = (s) => {
@@ -34,7 +35,7 @@ const warnInvalidSource = (s) => {
 const shouldTrigger = (value, oldValue) => hasChanged(value, oldValue) || isObject(value)
 
 const processWatchOptionsCompat = (options) => {
-  const newOptions = { ...options }
+  const newOptions = extend({}, options)
   if (options.sync) {
     newOptions.flush = 'sync'
   }

package/src/platform/builtInMixins/index.js

@@ -37,6 +37,11 @@ export default function getBuiltInMixins ({ type, rawOptions = {} }) {
       // 由于relation可能是通过mixin注入的，不能通过当前的用户options中是否存在relations来简单判断是否注入该项mixin
       relationsMixin(type)
     ]
+  } else if (__mpx_mode__ === 'tenon') {
+    bulitInMixins = [
+      proxyEventMixin(),
+      pageStatusMixin(type)
+    ]
   } else {
     // 此为差异抹平类mixins，原生模式下也需要注入也抹平平台差异
     bulitInMixins = [

package/src/platform/builtInMixins/pageStatusMixin.tenon.js

@@ -0,0 +1,40 @@
+import { CREATED, ONSHOW, ONHIDE } from '../../core/innerLifecycle'
+
+export default function pageStatusMixin (mixinType) {
+  if (mixinType === 'page') {
+    return {
+      data: {
+        mpxPageStatus: 'show'
+      },
+      onShow () {
+        this.mpxPageStatus = 'show'
+        this.__mpxProxy.callHook(ONSHOW)
+      },
+      onHide () {
+        this.mpxPageStatus = 'hide'
+        this.__mpxProxy.callHook(ONHIDE)
+      },
+      onBack () {
+        return this.onBack && this.onBack()
+      }
+    }
+  }
+  // components
+  return {
+    [CREATED] () {
+      const pageInstance = global.__currentPageInstance
+      if (!pageInstance) return
+      this.$watch(
+        () => pageInstance.mpxPageStatus,
+        status => {
+          if (!status) return
+          const pageLifetimes = (this.$rawOptions && this.$rawOptions.pageLifetimes) || {}
+          // show & hide
+          if (status in pageLifetimes && typeof pageLifetimes[status] === 'function') {
+            pageLifetimes[status].call(this)
+          }
+        }
+      )
+    }
+  }
+}

package/src/platform/builtInMixins/proxyEventMixin.tenon.js

@@ -0,0 +1,46 @@
+import { setByPath } from '@mpxjs/utils'
+
+export default function proxyEventMixin () {
+  const methods = {
+    triggerEvent (eventName, eventDetail) {
+      return this.$emit(eventName, {
+        type: eventName,
+        detail: eventDetail
+      })
+    },
+    __model (expr, $event, valuePath = ['value'], filterMethod) {
+      const innerFilter = {
+        trim: val => typeof val === 'string' && val.trim()
+      }
+      const originValue = valuePath.reduce((acc, cur) => acc[cur], $event.detail)
+      const value = filterMethod ? (innerFilter[filterMethod] ? innerFilter[filterMethod](originValue) : typeof this[filterMethod] === 'function' && this[filterMethod]) : originValue
+      setByPath(this, expr, value)
+    },
+    getOpenerEventChannel () {
+      const router = global.__mpxRouter
+      const eventChannel = router && router.__mpxAction && router.__mpxAction.eventChannel
+      return eventChannel
+    }
+  }
+
+  return {
+    beforeCreate () {
+      const modelEvent = this.$attrs.mpxModelEvent
+      const modelEventId = this.$attrs.mpxModelEventId
+      if (modelEvent && modelEventId) {
+        Hummer.notifyCenter.addEventListener(modelEventId, (e) => {
+          this.$emit('mpxModel', e)
+        })
+      }
+    },
+    beforeDestroy () {
+      const modelEvent = this.$attrs.mpxModelEvent
+      const modelEventId = this.$attrs.mpxModelEventId
+      if (modelEvent && modelEventId) {
+        Hummer.notifyCenter.removeEventListener(modelEventId)
+      }
+    },
+
+    methods
+  }
+}

package/src/platform/builtInMixins/styleHelperMixin.ios.js

@@ -1,4 +1,4 @@
-import { isObject, isArray, dash2hump, cached } from '@mpxjs/utils'
+import { isObject, isArray, dash2hump, cached, isEmptyObject } from '@mpxjs/utils'
 import { Dimensions, StyleSheet } from 'react-native'
 
 let { width, height } = Dimensions.get('screen')
@@ -26,6 +26,8 @@ const unit = {
   vh
 }
 
+const empty = {}
+
 function formatValue (value) {
   const matched = unitRegExp.exec(value)
   if (matched) {
@@ -179,9 +181,9 @@ export default function styleHelperMixin () {
             } else if (appClassMap[className]) {
               // todo 全局样式在每个页面和组件中生效，以支持全局原子类，后续支持样式模块复用后可考虑移除
               Object.assign(result, appClassMap[className])
-            } else if (this.props[className] && isObject(this.props[className])) {
+            } else if (this.__props[className] && isObject(this.__props[className])) {
               // externalClasses必定以对象形式传递下来
-              Object.assign(result, this.props[className])
+              Object.assign(result, this.__props[className])
             }
           })
         }
@@ -196,7 +198,8 @@ export default function styleHelperMixin () {
             display: 'none'
           })
         }
-        return result
+
+        return isEmptyObject(result) ? empty : result
       }
     }
   }