@tarojs/taro 4.0.7-canary.6 → 4.0.8-alpha.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tarojs/taro",
-  "version": "4.0.7-canary.6",
+  "version": "4.0.8-alpha.0",
   "description": "Taro framework",
   "author": "O2Team",
   "license": "MIT",
@@ -24,8 +24,8 @@
   },
   "dependencies": {
     "@types/postcss-url": "^10.0.4",
-    "@tarojs/api": "4.0.7-canary.6",
-    "@tarojs/runtime": "4.0.7-canary.6"
+    "@tarojs/api": "4.0.8-alpha.0",
+    "@tarojs/runtime": "4.0.8-alpha.0"
   },
   "devDependencies": {
     "@types/react": "^18.3.1",
@@ -35,9 +35,9 @@
     "webpack-chain": "^6.5.1",
     "webpack-dev-server": "^4.15.2",
     "rollup": "^3.29.4",
-    "@tarojs/components": "4.0.7-canary.6",
-    "@tarojs/shared": "4.0.7-canary.6",
-    "@tarojs/helper": "4.0.7-canary.6"
+    "@tarojs/components": "4.0.8-alpha.0",
+    "@tarojs/helper": "4.0.8-alpha.0",
+    "@tarojs/shared": "4.0.8-alpha.0"
   },
   "peerDependencies": {
     "@types/react": "^18",
@@ -48,9 +48,9 @@
     "webpack": "^5",
     "webpack-chain": "^6",
     "webpack-dev-server": "^4",
-    "@tarojs/components": "4.0.7-canary.6",
-    "@tarojs/shared": "4.0.7-canary.6",
-    "@tarojs/helper": "4.0.7-canary.6"
+    "@tarojs/helper": "4.0.8-alpha.0",
+    "@tarojs/shared": "4.0.8-alpha.0",
+    "@tarojs/components": "4.0.8-alpha.0"
   },
   "peerDependenciesMeta": {
     "@types/react": {

package/types/api/route/index.d.ts

@@ -44,10 +44,16 @@ declare module '../../index' {
     interface Option {
       /** 需要跳转的应用内非 tabBar 的页面的路径, 路径后可以带参数。参数与路径之间使用 `?` 分隔，参数键与参数值用 `=` 相连，不同参数用 `&` 分隔；如 'path?key=value&key2=value2' */
       url: string
-      /** 接口调用结束的回调函数（调用成功、失败都会执行） */
-      complete?: (res: TaroGeneral.CallbackResult) => void
       /** 页面间通信接口，用于监听被打开页面发送到当前页面的数据。 */
       events?: TaroGeneral.IAnyObject
+      /** 2.29.2 自定义路由类型 */
+      routeType?: string
+      /** 3.4.0 自定义路由配置 */
+      routeConfig?: TaroGeneral.IAnyObject
+      /** 3.4.0 自定义路由参数 */
+      routeOptions?: TaroGeneral.IAnyObject
+      /** 接口调用结束的回调函数（调用成功、失败都会执行） */
+      complete?: (res: TaroGeneral.CallbackResult) => void
       /** 接口调用失败的回调函数 */
       fail?: (res: TaroGeneral.CallbackResult) => void
       /** 接口调用成功的回调函数 */
@@ -115,6 +121,103 @@ declare module '../../index' {
     ): void
   }
 
+  namespace router {
+    type CustomRouteBuilder = (routeContext: CustomRouteContext, routeOptions: Record<string, any>) => CustomRouteConfig
+
+    interface SharedValue<T> {
+      value: T
+    }
+
+    interface CustomRouteContext {
+      // 动画控制器，影响推入页面的进入和退出过渡效果
+      primaryAnimation: SharedValue<number>
+      // 动画控制器状态
+      primaryAnimationStatus: SharedValue<number>
+      // 动画控制器，影响栈顶页面的推出过渡效果
+      secondaryAnimation: SharedValue<number>
+      // 动画控制器状态
+      secondaryAnimationStatus: SharedValue<number>
+      // 当前路由进度由手势控制
+      userGestureInProgress: SharedValue<number>
+      // 手势开始控制路由
+      startUserGesture: () => void
+      // 手势不再控制路由
+      stopUserGesture: () => void
+      // 返回上一级，效果同 wx.navigateBack
+      didPop: () => void
+    }
+
+    interface CustomRouteConfig {
+      // 下一个页面推入后，不显示前一个页面
+      opaque?: boolean
+      // 是否保持前一个页面状态
+      maintainState?: boolean
+      // 页面推入动画时长，单位 ms
+      transitionDuration?: number
+      // 页面推出动画时长，单位 ms
+      reverseTransitionDuration?: number
+      // 遮罩层背景色，支持 rgba() 和 #RRGGBBAA 写法
+      barrierColor?: string
+      // 点击遮罩层返回上一页
+      barrierDismissible?: boolean
+      // 无障碍语义
+      barrierLabel?: string
+      // 是否与下一个页面联动，决定当前页 secondaryAnimation 是否生效
+      canTransitionTo?: boolean
+      // 是否与前一个页面联动，决定前一个页 secondaryAnimation 是否生效
+      canTransitionFrom?: boolean
+      // 处理当前页的进入/退出动画，返回 StyleObject
+      handlePrimaryAnimation?: RouteAnimationHandler
+      // 处理当前页的压入/压出动画，返回 StyleObject
+      handleSecondaryAnimation?: RouteAnimationHandler
+      // 处理上一级页面的压入/压出动画，返回 StyleObject 基础库 <3.0.0> 起支持
+      handlePreviousPageAnimation?: RouteAnimationHandler
+      // 页面进入时是否采用 snapshot 模式优化动画性能 基础库 <3.2.0> 起支持
+      allowEnterRouteSnapshotting?: boolean
+      // 页面退出时是否采用 snapshot 模式优化动画性能 基础库 <3.2.0> 起支持
+      allowExitRouteSnapshotting?: boolean
+      // 右滑返回时，可拖动范围是否撑满屏幕，基础库 <3.2.0> 起支持，常用于半屏弹窗
+      fullscreenDrag?: boolean
+      // 返回手势方向 基础库 <3.4.0> 起支持
+      popGestureDirection?: 'horizontal' | 'vertical' | 'multi'
+    }
+
+    type RouteAnimationHandler = () => { [key: string] : any}
+
+    /** 自定义路由
+     * @supported weapp
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/route/router/wx.router.html
+     */
+    interface router {
+      /** 添加自定义路由配置
+       * @supported weapp
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/route/router/base/router.addRouteBuilder.html
+       */
+      addRouteBuilder(
+        /** 路由类型 */
+        routeType: string,
+        /** 路由动画定义函数 */
+        routeBuilder: CustomRouteBuilder
+      ): void
+      /** 获取页面对应的自定义路由上下文对象
+       * @supported weapp
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/route/router/base/router.getRouteContext.html
+       */
+      getRouteContext(
+        /** 页面/自定义组件实例 */
+        instance: TaroGeneral.IAnyObject
+      ): CustomRouteContext
+      /** 移除自定义路由配置
+       * @supported weapp
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/route/router/base/router.removeRouteBuilder.html
+       */
+      removeRouteBuilder(
+        /** 路由类型 */
+        routeType: string,
+      ): void
+    }
+  }
+
   interface TaroStatic {
     /** 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面
      * @supported weapp, h5, rn, tt, harmony, harmony_hybrid
@@ -216,5 +319,6 @@ declare module '../../index' {
      * @see https://developers.weixin.qq.com/miniprogram/dev/api/route/wx.navigateBack.html
      */
     navigateBack(option?: navigateBack.Option): Promise<TaroGeneral.CallbackResult>
+    router: router.router
   }
 }

package/types/api/skyline/index.d.ts

@@ -56,4 +56,290 @@ declare module '../../index' {
       }
     }
   }
+
+  /**
+   * DraggableSheet 实例，可通过 Taro.createSelectorQuery 的 NodesRef.node 方法获取。
+   *
+   * @supported weapp
+   * @see https://developers.weixin.qq.com/miniprogram/dev/api/skyline/DraggableSheetContext.html
+   */
+  interface DraggableSheetContext {
+    /**
+     * 滚动到指定位置。size 取值 [0, 1]，size = 1 时表示撑满 draggable-sheet 组件。size 和 pixels 同时传入时，仅 size 生效。
+     * @param option
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/skyline/DraggableSheetContext.scrollTo.html
+     */
+    scrollTo(option: DraggableSheetContext.scrollTo.Option): void
+  }
+
+  namespace DraggableSheetContext {
+    namespace scrollTo {
+      interface Option {
+        /** 相对目标位置 */
+        size?: number
+        /** 绝对目标位置 */
+        pixels?: number
+        /**
+         * 是否启用滚动动画
+         * @default true
+         */
+        animated?: boolean
+        /**
+         * 滚动动画时长（ms)
+         * @default 300
+         */
+        duration?: number
+        /**
+         * 缓动函数
+         * @default ease
+         */
+        easingFunction?: string
+      }
+    }
+  }
+
+  /**
+   * worklet 对象，可以通过 wx.worklet 获取
+   *
+   * @supported weapp-skyline
+   * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/wx.worklet.html
+   */
+  interface worklet {
+    /**
+     * 取消由 SharedValue 驱动的动画
+     * @param SharedValue
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/base/worklet.cancelAnimation.html
+     */
+    cancelAnimation(SharedValue: worklet.SharedValue): void
+    /**
+     * 衍生值 DerivedValue，可基于已有的 SharedValue 生成其它共享变量。
+     * @param updaterWorklet
+     * @returns 返回 DerivedValue 类型值，可被 worklet 函数捕获。DerivedValue 也是 SharedValue 类型。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/base/worklet.derived.html
+     */
+    derived(updaterWorklet: worklet.WorkletFunction): worklet.DerivedValue
+    /**
+     * ScrollView 实例，可在 worklet 函数内操作 scroll-view 组件。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/base/worklet.scrollViewContext.html
+     */
+    scrollViewContext: {
+      /**
+       * 滚动至指定位置
+       * @param object
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/base/worklet.scrollViewContext.scrollTo.html
+       */
+      scrollTo(NodesRef: TaroGeneral.IAnyObject, object: worklet.scrollViewContext.Option): void
+    }
+    /**
+     * 创建共享变量 SharedValue，用于跨线程共享数据和驱动动画。
+     * @param initialValue
+     * @returns 返回 SharedValue 类型值，可被 worklet 函数捕获。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/base/worklet.shared.html
+     */
+    shared(initialValue: number | string | bool | null | undefined | Object | Array | Function): worklet.SharedValue
+    /**
+     * 基于滚动衰减的动画。
+     * @param options 动画配置
+     * @param callback 动画完成回调。动画被取消时，返回 fasle，正常完成时返回 true。
+     * @returns 返回 AnimationObject 类型值，可直接赋值给 SharedValue。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.decay.html
+     */
+    decay(options?: worklet.decay.Option, callback?: (flag: boolean) => void): worklet.AnimationObject
+    Easing: worklet.Easing
+    /**
+     * 基于物理的动画。
+     * @param toValue 目标值
+     * @param options 动画配置
+     * @param callback 动画完成回调。动画被取消时，返回 fasle，正常完成时返回 true。
+     * @returns 返回 AnimationObject 类型值，可直接赋值给 SharedValue。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.spring.html
+     */
+    spring(toValue: number | string, options?: worklet.spring.Option, callback?: (flag: boolean) => void): worklet.AnimationObject
+    /**
+     * 基于时间的动画。
+     * @param toValue 目标值
+     * @param options 动画配置
+     * @param callback 动画完成回调。动画被取消时，返回 fasle，正常完成时返回 true。
+     * @returns 返回 AnimationObject 类型值，可直接赋值给 SharedValue。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.timing.html
+     */
+    timing(toValue: number | string, options?: worklet.timing.Option, callback?: (flag: boolean) => void): worklet.AnimationObject
+    /**
+     * 延迟执行动画。
+     * @param delayMS 动画开始前等待的时间，单位：毫秒
+     * @param delayedAnimation 动画对象
+     * @returns 返回 AnimationObject 类型值，可直接赋值给 SharedValue。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/combine-animation/worklet.delay.html
+     */
+    delay(delayMS: number, delayedAnimation: worklet.AnimationObject): worklet.AnimationObject
+    /**
+     * 重复执行动画。
+     * @param animation 动画对象
+     * @param numberOfReps 重复次数。为负值时一直循环，直到被取消动画。
+     * @param reverse 反向运行动画，每周期结束动画由尾到头运行。该字段仅对 timing 和 spring 返回的动画对象生效。
+     * @param callback 动画完成回调。动画被取消时，返回 fasle，正常完成时返回 true。
+     * @returns 返回 AnimationObject 类型值，可直接赋值给 SharedValue。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/combine-animation/worklet.repeat.html
+     */
+    repeat(delayedAnimation: worklet.AnimationObject, numberOfReps: number, reverse?: boolean, callback?: (flag: boolean) => void): worklet.AnimationObject
+    /**
+     * 组合动画序列，依次执行传入的动画。
+     * @param animation 动画对象
+     * @returns 返回 AnimationObject 类型值，可直接赋值给 SharedValue。
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/combine-animation/worklet.sequence.html
+     */
+    sequence(...delayedAnimation: worklet.AnimationObject): worklet.AnimationObject
+    /**
+     * worklet 函数运行在 UI 线程时，捕获的外部函数可能为 worklet 类型或普通函数，为了更明显的对其区分，要求必须使用 runOnJS 调回 JS 线程的普通函数。 有这样的要求是因为，调用其它 worklet 函数时是同步调用，但在 UI 线程执行 JS 线程的函数只能是异步，开发者容易混淆，试图同步获取 JS 线程的返回值。
+     * @param fn worklet 类型函数
+     * @returns runOnJS 为高阶函数，返回一个函数，执行时运行在 JS 线程
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/tool-function/worklet.runOnJS.html
+     */
+    runOnJS(fn: TaroGeneral.TFunc): TaroGeneral.TFunc
+    /**
+     * 在 UI 线程执行 worklet 函数
+     * @param fn worklet 类型函数
+     * @returns runOnUI 为高阶函数，返回一个函数，执行时运行在 UI 线程
+     * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/tool-function/worklet.runOnUI.html
+     */
+    runOnUI(fn: TaroGeneral.TFunc): TaroGeneral.TFunc
+  }
+
+  namespace worklet {
+    type SharedValue = TaroGeneral.IAnyObject
+    type DerivedValue = worklet.SharedValue
+    type AnimationObject = TaroGeneral.IAnyObject
+    type WorkletFunction = TaroGeneral.TFunc
+
+    namespace scrollViewContext {
+      interface Option {
+        /** 顶部距离 */
+        top?: number
+        /** 左边界距离 */
+        left?: number
+        /** 滚动动画时长 */
+        duration?: number
+        /** 是否启用滚动动画 */
+        animated?: boolean
+        /** 动画曲线 */
+        easingFunction?: string
+      }
+    }
+
+    namespace decay {
+      interface Option {
+        /** 初速度 */
+        velocity?: number
+        /** 衰减速率 */
+        deceleration?: number
+        /** 边界值，长度为 2 的数组 */
+        clamp?: Array<number>
+      }
+    }
+
+    interface Easing {
+      /**
+       * 简单的反弹效果
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      bounce(t: number): any;
+      /**
+       * 简单的惯性动画
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      ease(t: number): any;
+      /**
+       * 简单的弹性动画，类似弹簧来回摆动，高阶函数。默认弹性为 1，会稍微超出一次。弹性为 0 时 不会过冲
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      elastic(bounciness?: number): any;
+      /**
+       * 线性函数
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      linear(t: number): any;
+      /**
+       * 二次方函数
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      quad(t: number): any;
+      /**
+       * 立方函数
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      cubic(t: number): any;
+      /**
+       * 高阶函数，返回幂函数
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      poly(n: number): any;
+      /**
+       * 三次贝塞尔曲线，效果同 css transition-timing-function
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      bezier(x1: number, y1: number, x2: number, y2: number): any;
+      /**
+       * 圆形曲线
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      circle(t: number): any;
+      /**
+       * 正弦函数
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      sin(t: number): any;
+      /**
+       * 指数函数
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      exp(t: number): any;
+      /**
+       * 正向运行 easing function，高阶函数。
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      in(easing: (t: number) => any): any;
+      /**
+       * 反向运行 easing function，高阶函数。
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      out(easing: (t: number) => any): any;
+      /**
+       * 前半程正向，后半程反向，高阶函数。
+       * @see https://developers.weixin.qq.com/miniprogram/dev/api/ui/worklet/animation/worklet.Easing.html
+       */
+      inOut(easing: (t: number) => any): any;
+    }
+
+    namespace spring {
+      interface Option {
+        /** 阻尼系数 */
+        damping?: number
+        /** 重量系数，值越大移动越慢 */
+        mass?: number
+        /** 弹性系数 */
+        stiffness?: number
+        /** 动画是否可以在指定值上反弹 */
+        overshootClamping?: boolean
+        /** 弹簧静止时的位移 */
+        restDisplacementThreshold?: number
+        /** 弹簧静止的速度 */
+        restSpeedThreshold?: number
+        /** 速度 */
+        velocity?: number
+      }
+    }
+
+    namespace timing {
+      interface Option {
+        /** 动画时长 */
+        duration?: number
+        /** 动画曲线 */
+        easing?: (t: number) => number
+      }
+    }
+  }
+
+  interface TaroStatic {
+    worklet: worklet
+  }
 }

package/types/taro.component.d.ts

@@ -130,6 +130,26 @@ declare module './index' {
       /** 是否返回变更的 data 字段信息 */
       withDataPaths?: boolean
     }, listener: () => void): void
+    /**
+     * 绑定由 worklet 驱动的样式到相应的节点
+     * @param selector 节点选择器
+     * @param updater worklet 样式更新函数
+     * @param config 配置项
+     * @param callback 完成样式绑定的回调
+     * */
+    applyAnimatedStyle?(selector: string, updater: TaroGeneral.TFunc, config?: {
+      /** 是否立即执行一次 updater 函数 */
+      immediate?: boolean
+      /** 刷新时机，枚举值 async / sync */
+      flush?: string
+    }, callback?: TaroGeneral.TFunc): void
+    /**
+     * 清除节点上 worklet 驱动样式的绑定关系
+     * @param selector 节点选择器
+     * @param styleIds 需要清除的 styleId 集合
+     * @param callback 清除样式绑定的回调
+     * */
+    clearAnimatedStyle?(selector: string, styleIds: Array<Number>, callback?: TaroGeneral.TFunc): void
   }
   interface PageInstance extends PageLifeCycle, ComponentInstance {
     /** 页面配置 */