@tarojs/components 3.6.2 → 3.6.4

package/types/RootPortal.d.ts

@@ -3,12 +3,11 @@ import { StandardProps } from './common'
 interface RootPortalProps extends StandardProps {
   /**
    * 是否从页面中脱离出来
-   * @supported weapp
+   * @supported weapp, alipay
    * @default true
    */
   enable?: boolean
 }
-
 /** root-portal
  * 使整个子树从页面中脱离出来，类似于在 CSS 中使用 fixed position 的效果。主要用于制作弹窗、弹出层等。
  * @see https://developers.weixin.qq.com/miniprogram/dev/component/root-portal.html

package/types/RtcRoom.d.ts

@@ -5,96 +5,80 @@ interface RtcRoomProps extends StandardProps {
    * @supported swan
    */
   id?: string
-
   /** 是否开启摄像头
    * @supported swan
    * @default true
    */
   enableCamera?: boolean
-
   /** 是否开启摄像头自动对焦
    * @supported swan
    * @default true
    */
   enableAutoFocus?: boolean
-
   /** 是否支持双手滑动调整摄像头聚焦
    * @supported swan
    * @default false
    */
   enableZoom?: boolean
-
   /** 设置前置还是后置摄像头，有效值：front、back
    * @supported swan
    * @default "front"
    */
   devicePosition?: 'front' | 'back'
-
   /** 是否开启麦克风
    * @supported swan
    * @default true
    */
   enableMic?: boolean
-
   /** 是否开启音频自动增益
    * @supported swan
    * @default false
    */
   enableAgc?: boolean
-
   /** 是否开启音频噪声抑制
    * @supported swan
    * @default false
    */
   enableAns?: boolean
-
   /** 最大码率
    * @supported swan
    * @default 900
    */
   bitrate?: number
-
   /** 视频分辨率宽
    * @supported swan
    * @default 360
    */
   videoWidth?: number
-
   /** 视频分辨率高
    * @supported swan
    * @default 640
    */
   videoHeight?: number
-
   /** 设置远端看到的画面的镜像效果，该属性的变化不会影响到本地画面，仅影响远端看到的画面效果
    * @supported swan
    * @default false
    */
   enableRemoteMirror?: boolean
-
   /** 设置本地摄像头预览画面的镜像效果，有效值：auto、enable、disable
    * @supported swan
    * @default "auto"
    */
   localMirror?: 'auto' | 'enable' | 'disable'
-
   /** 设置声音输出方式，有效值：speaker、ear
    * @supported swan
    * @default "speaker"
    */
   soundMode?: 'speaker' | 'ear'
-
   /** 房间状态变化事件，参考下方状态码，detail = { code, msg, userInfo }
    * @supported swan
    */
   onStateChange?: CommonEventFunction
-
   /** 错误事件。参考下方错误码，detail = { errMsg, errCode }
    * @supported swan
    */
   onError?: CommonEventFunction
 }
-
 /** 实时音视频通话房间
  * @classification media
  * @supported swan

package/types/RtcRoomItem.d.ts

@@ -5,18 +5,15 @@ interface RtcRoomItemProps extends StandardProps {
    * @supported swan
    */
   id?: string
-
   /** 指定 item 展示本地 / 远端画面，有效值：local、remote ，不可动态变更
    * @supported swan
    */
   type?: string
-
   /** item 展示画面的用户 id
    * @supported swan
    */
   userId?: number
 }
-
 /** 实时音视频通话画面
  * @classification media
  * @supported swan

package/types/ScrollView.d.ts

@@ -7,222 +7,224 @@ interface ScrollViewProps extends StandardProps {
    * @rn 二选一
    */
   scrollX?: boolean
-
   /** 允许纵向滚动
    * @default false
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    * @rn 二选一
    */
   scrollY?: boolean
-
   /** 距顶部/左边多远时（单位px），触发 scrolltoupper 事件
    * @default 50
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   upperThreshold?: number
-
   /** 距底部/右边多远时（单位px），触发 scrolltolower 事件
    * @default 50
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   lowerThreshold?: number
-
   /** 设置竖向滚动条位置
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   scrollTop?: number
-
   /** 设置横向滚动条位置
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   scrollLeft?: number
-
   /** 值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素
    * @supported weapp, alipay, swan, tt, qq, jd, h5
    */
   scrollIntoView?: string
-
   /** 在设置滚动条位置时使用动画过渡
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    * @default false
    */
   scrollWithAnimation?: boolean
-
   /** iOS 点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部，只支持竖向
    * @supported weapp, alipay, swan, qq, jd, rn
    * @default false
    */
   enableBackToTop?: boolean
-
   /** 启用 flexbox 布局。开启后，当前节点声明了 `display: flex` 就会成为 flex container，并作用于其孩子节点。
    * @supported weapp
    * @default false
    */
   enableFlex?: boolean
-
   /** 开启 scroll anchoring 特性，即控制滚动位置不随内容变化而抖动，仅在 iOS 下生效，安卓下可参考 CSS `overflow-anchor` 属性。
    * @supported weapp
    * @default false
    */
   scrollAnchoring?: boolean
-
   /** 开启自定义下拉刷新
    * @supported weapp
    * @default false
    */
   refresherEnabled?: boolean
-
   /** 设置自定义下拉刷新阈值
    * @supported weapp
    * @default 45
    */
   refresherThreshold?: number
-
   /** 设置自定义下拉刷新默认样式，支持设置 `black | white | none`， none 表示不使用默认样式
    * @supported weapp
    * @default 'black'
    */
   refresherDefaultStyle?: string
-
   /** 设置自定义下拉刷新区域背景颜色
    * @supported weapp
    * @default '#FFF'
    */
   refresherBackground?: string
-
   /** 设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发
    * @supported weapp
    * @default false
    */
   refresherTriggered?: boolean
-
   /** 启用 scroll-view 增强特性
    * @supported weapp
    * @default false
    */
   enhanced?: boolean
-
   /** iOS 下 scroll-view 边界弹性控制 (同时开启 enhanced 属性后生效)
    * @supported weapp
    * @default true
    */
   bounces?: boolean
-
   /** 滚动条显隐控制 (同时开启 enhanced 属性后生效)
    * @supported weapp
    * @default true
    */
   showScrollbar?: boolean
-
   /** 分页滑动效果 (同时开启 enhanced 属性后生效)
    * @supported weapp
    * @default false
    */
   pagingEnabled?: boolean
-
   /** boolean	false	滑动减速速率控制 (同时开启 enhanced 属性后生效)
    * @supported weapp
    * @default false
    */
   fastDeceleration?: boolean
-
   /** 当 scroll-with-animation设置为 true 时，可以设置 scroll-animation-duration 来控制动画的执行时间，单位 ms。
    * @supported alipay
    */
   scrollAnimationDuration?: string
-
   /** 纵向滚动时，当滚动到顶部或底部时，强制禁止触发页面滚动，仍然只触发 scroll-view 自身的滚动。
    * @supported alipay
    * @default false
    */
   trapScroll?: string
-
   /** 发生滚动前，对滚动方向进行判断，当方向是顶部/左边时，如果值为 always 将始终禁止滚动，如果值为 out-of-bounds 且当前已经滚动到顶部/左边，禁止滚动。
    * @supported alipay
    */
   disableLowerScroll?: string
-
   /** 发生滚动前，对滚动方向进行判断，当方向是底部/右边时，如果值为 always 将始终禁止滚动，如果值为 out-of-bounds 且当前已经滚动到底部/右边，禁止滚动。
    * @supported alipay
    */
   disableUpperScroll?: string
-
   /** 无障碍访问，（属性）元素的额外描述
    * @supported qq
    */
   ariaLabel?: string
-
   /** 开启 passive 特性，能优化一定的滚动性能
    * @supported weapp
    * @default false
    */
   enablePassive?: string
-
+  /** 渲染模式
+   * list - 列表模式。只会渲染在屏节点，会根据直接子节点是否在屏来按需渲染，若只有一个直接子节点则性能会退化
+   * custom - 自定义模式。只会渲染在屏节点，子节点可以是 sticky-section list-view grid-view 等组件
+   * @supported weapp
+   * @default 'list'
+   */
+  type: 'list' | 'custom'
+  /** 是否反向滚动。一般初始滚动位置是在顶部，反向滚动则是在底部。
+   * @supported weapp
+   * @default false
+   */
+  reverse?: boolean
+  /** 指定视口外渲染区域的距离，默认情况下视口外节点不渲染。指定 cache-extent 可优化滚动体验和加载速度，但会提高内存占用且影响首屏速度，可按需启用。
+   * @supported weapp
+   */
+  cacheExtent?: number
+  /** 只 scroll-into-view 到 cacheExtent 以内的目标节点，性能更佳
+   * @supported weapp
+   * @default false
+   */
+  scrollIntoViewWithinExtent?: boolean
+  /** 指定 scroll-into-view 目标节点在视口内的位置。
+   * start - 目标节点显示在视口开始处
+   * center - 目标节点显示在视口中间
+   * end - 目标节点显示在视口结束处
+   * nearest - 目标节点在就近的视口边缘显示，若节点已在视口内则不触发滚动
+   * @supported weapp
+   * @default 'start'
+   */
+  scrollIntoViewAlignment?: 'start' | 'center' | 'end' | 'nearest'
   /** 滚动到顶部/左边，会触发 scrolltoupper 事件
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   onScrollToUpper?: CommonEventFunction
-
   /** 滚动到底部/右边，会触发 scrolltolower 事件
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   onScrollToLower?: CommonEventFunction
-
   /** 滚动时触发
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   onScroll?: BaseEventOrigFunction<ScrollViewProps.onScrollDetail>
-
+  /** 滚动开始事件
+   * @supported weapp
+   */
+  onScrollStart?:BaseEventOrigFunction<ScrollViewProps.onScrollDetail>
+  /** 滚动结束事件
+   * @supported weapp
+   */
+  onScrollEnd?:BaseEventOrigFunction<ScrollViewProps.onScrollDetail>
   /** 自定义下拉刷新控件被下拉
    * @supported weapp
    */
   onRefresherPulling?: CommonEventFunction
-
   /** 自定义下拉刷新被触发
    * @supported weapp
    */
   onRefresherRefresh?: CommonEventFunction
-
   /** 自定义下拉刷新被复位
    * @supported weapp
    */
   onRefresherRestore?: CommonEventFunction
-
   /** 自定义下拉刷新被中止
    * @supported weapp
    */
   onRefresherAbort?: CommonEventFunction
-
+  /** 自定义下拉刷新即将触发刷新（拖动超过 refresher-threshold 时）的事件
+   * @supported weapp
+   */
+  onRefresherWillRefresh?: CommonEventFunction
   /** 滑动开始事件 (同时开启 enhanced 属性后生效)
    * @supported weapp
    */
   onDragStart?: CommonEventFunction<ScrollViewProps.onDragDetail>
-
   /** 滑动事件 (同时开启 enhanced 属性后生效)
    * @supported weapp
    */
   onDragging?: CommonEventFunction<ScrollViewProps.onDragDetail>
-
   /** 滑动结束事件 (同时开启 enhanced 属性后生效)
    * @supported weapp
    */
   onDragEnd?: CommonEventFunction<ScrollViewProps.onDragDetail>
-
   /** 触摸动作开始。
    * @supported alipay
    */
   onTouchStart?: CommonEventFunction
-
   /** 触摸后移动。
    * @supported alipay
    */
   onTouchMove?: CommonEventFunction
-
   /** 触摸动作结束。
    * @supported alipay
    */
   onTouchEnd?: CommonEventFunction
-
   /** 触摸动作被打断，如来电提醒、弹窗。
    * @supported alipay
    */
@@ -232,30 +234,25 @@ declare namespace ScrollViewProps {
   interface onScrollDetail {
     /** 横向滚动条位置 */
     scrollLeft: number
-
     /** 竖向滚动条位置 */
     scrollTop: number
-
     /** 滚动条高度 */
     scrollHeight: number
-
     /** 滚动条宽度 */
     scrollWidth: number
     deltaX: number
     deltaY: number
+    isDrag?: boolean
   }
   interface onDragDetail {
     /** 横向滚动条位置 */
     scrollLeft: number
-
     /** 竖向滚动条位置 */
     scrollTop: number
-
     /** 滚动速度 */
     velocity: number
   }
 }
-
 /** 可滚动视图区域。使用竖向滚动时，需要给scroll-view一个固定高度，通过 WXSS 设置 height。组件属性的长度单位默认为 px
  *
  * Tips:

package/types/ShareElement.d.ts

@@ -5,31 +5,26 @@ interface ShareElementProps extends StandardProps {
    * @supported weapp
    */
   key?: string
-
   /** 映射标记
    * @supported alipay
    */
   name?: string
-
   /** 是否进行动画
    * @default false
    * @supported weapp, alipay
    */
   transform?: boolean
-
   /** 动画时长，单位毫秒
    * @default 300
    * @supported weapp, alipay
    */
   duration?: number
-
   /** css缓动函数
    * @default ease-out
    * @supported weapp, alipay
    */
   easingFunction?: string
 }
-
 /** 共享元素
  *
  * 共享元素是一种动画形式，类似于 [`flutter Hero`](https://flutterchina.club/animations/hero-animations/) 动画，表现为元素像是在页面间穿越一样。该组件需与 [`PageContainer`](/docs/components/viewContainer/page-container) 组件结合使用。
@@ -95,7 +90,7 @@ interface ShareElementProps extends StandardProps {
  *         {
  *           contacts.map((item, index) => (
  *             <View key={item.id} className="contact" onClick={e => showNext(e, index)}>
- *               <ShareElement duration={300} className="name" mapkey="name" transform={transformIdx === index}>
+ *               <ShareElement duration={300} className="name" key="name" transform={transformIdx === index}>
  *                 {item.name}
  *               </ShareElement>
  *               <View className="list">
@@ -122,7 +117,7 @@ interface ShareElementProps extends StandardProps {
  *       >
  *         <View className="screen screen2">
  *           <View className="contact">
- *             <ShareElement className="name" mapkey="name" duration={300} transform>
+ *             <ShareElement className="name" key="name" duration={300} transform>
  *               {contact.name}
  *             </ShareElement>
  *             <View className={`paragraph ${show ? 'enter' : ''}`}>

package/types/Slider.d.ts

@@ -6,105 +6,87 @@ interface SliderProps extends StandardProps, FormItemProps {
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   min?: number
-
   /** 最大值
    * @default 100
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   max?: number
-
   /** 步长，取值必须大于 0，并且可被(max - min)整除
    * @default 1
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   step?: number
-
   /** 是否禁用
    * @default false
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   disabled?: boolean
-
   /** 当前取值
    * @default 0
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   value?: number
-
   /** 背景条的颜色（请使用 backgroundColor）
    * @default "#e9e9e9"
    * @supported weapp, tt, qq, jd
    */
   color?: string
-
   /** 已选择的颜色（请使用 activeColor）
    * @default "#1aad19"
    * @supported weapp, tt, qq, jd
    */
   selectedColor?: string
-
   /** 已选择的颜色
    * @default "#1aad19"
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   activeColor?: string
-
   /** 背景条的颜色
    * @default "#e9e9e9"
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   backgroundColor?: string
-
   /** 滑块的大小，取值范围为 12 - 28
    * @default 28
    *  @supported weapp, swan, tt, qq, jd, h5
    */
   blockSize?: number
-
   /** 滑块的颜色
    * @default "#ffffff"
    * @supported weapp, swan, tt, qq, jd, h5, rn
    */
   blockColor?: string
-
   /** 是否显示当前 value
    * @default false
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   showValue?: boolean
-
   /** 组件名字，用于表单提交获取数据。
    * @supported alipay
    */
   name?: string
-
   /** 轨道线条高度。
    * @default 4
    * @supported alipay
    */
   trackSize?: string
-
   /** 滑块大小。
    * @default 22
    * @supported alipay
    */
   handleSize?: string
-
   /** 滑块填充色，同 CSS 色值。
    * @supported alipay
    */
   handleColor?: string
-
   /** 无障碍访问，（属性）元素的额外描述
    * @supported qq
    */
   ariaLabel?: string
-
   /** 完成一次拖动后触发的事件
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
   onChange?: CommonEventFunction<SliderProps.onChangeEventDetail>
-
   /** 拖动过程中触发的事件
    * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
    */
@@ -115,7 +97,6 @@ declare namespace SliderProps {
     value
   }
 }
-
 /** 滑动选择器
  * @classification forms
  * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony

package/types/StickyHeader.d.ts

@@ -0,0 +1,12 @@
+import { ComponentType } from 'react'
+import { StandardProps } from './common'
+interface StickyHeaderProps extends StandardProps {}
+
+/**
+ * 吸顶布局容器，仅支持作为 scroll-view 自定义模式下的直接子节点或 sticky-section 组件直接子节点。仅 Skyline 支持。
+ * @classification viewContainer
+ * @supported weapp
+ * @see https://developers.weixin.qq.com/miniprogram/dev/component/sticky-header.html
+ */
+declare const StickyHeader: ComponentType<StickyHeaderProps>
+export { StickyHeader, StickyHeaderProps }

package/types/StickySection.d.ts

@@ -0,0 +1,18 @@
+import { ComponentType } from 'react'
+import { StandardProps } from './common'
+interface StickySectionProps extends StandardProps {
+  /** 吸顶元素重叠时是否继续上推
+   * @supported weapp
+   * @default true
+   */
+  pushPinnedHeader?: boolean
+}
+
+/**
+ * 吸顶布局容器，仅支持作为 scroll-view 自定义模式下的直接子节点。仅 Skyline 支持。
+ * @classification viewContainer
+ * @supported weapp
+ * @see https://developers.weixin.qq.com/miniprogram/dev/component/sticky-section.html
+ */
+declare const StickySection: ComponentType<StickySectionProps>
+export { StickySection, StickySectionProps }