tmui-cli 2.0.3 → 2.0.4

package/data/uniappx/component/rich-text.md

@@ -0,0 +1,244 @@
+::: sourceCode
+## rich-text
+
+> GitCode: https://gitcode.com/dcloud/uni-component/tree/alpha/uni_modules/uni-rich-text
+
+> GitHub: https://github.com/dcloudio/uni-component/tree/alpha/uni_modules/uni-rich-text
+
+> 组件类型：UniRichTextElement 
+
+ 富文本。可渲染文字样式、图片、超链接。支持部分HTML标签
+
+以往开发者在app平台渲染富文本，大多使用webview。但webview启动慢、快滚白屏，在部分设备上被限死刷新率不能超过60帧。
+
+虽然uni-app x的rich-text组件也支持mode=web，但在app平台蒸汽模式下，提供了c语言全新实现的rich-text mode=native。
+
+uni-app x 蒸汽模式的rich-text native，应该是业内最佳的富文本呈现的解决方案。可以瞬间加载5万字长文、多图混排，流畅的快速滚动，不白屏、不掉帧。[详见评测](../app-vapor.md#rich-text)。
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 4.0 | 4.41 | 3.9 | 4.11 | 4.61 |
+
+### 支持的HTML标签和属性
+|HTML   |属性    |样式   |
+|-------|-------|-------|
+|br     |       |       |
+|p      |       |text-align color background-color text-decoration|
+|ul     |       |       |
+|li     |       |text-align color background-color text-decoration|
+|span   |       |color background-color text-decoration|
+|strong |       |       |
+|i      |       |       |
+|big    |       |       |
+|small  |       |       |
+|a      |href   |       |
+|u      |       |       |
+|del    |       |       |
+|h1-h6  |       |       |
+|img    |src    |       |
+
+> text-decoration仅支持line-through
+> 仅在 app-android 平台 VDOM 模式下且配置 mode=native 时受上述表格限制
+
+### 属性 
+| 名称 | 类型 | 默认值 | 兼容性 | 描述 |
+| :- | :- | :- |  :-: | :- |
+| nodes | any |   | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 节点列表/HTML String |
+| ~~selectable~~ | boolean | false | Web 5.24 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 文本是否可选。已废弃，请使用 user-select |
+| mode | string | "web" | Web x / 微信小程序 x / Android 4.71 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 渲染模式 |
+| 合法值 | 兼容性 | 描述 |
+| :- |  :-: | :- |
+| web | Web x / 微信小程序 x / Android 4.71 / iOS 4.11 / HarmonyOS 4.61（部分支持，见上） | 使用webview渲染 |
+| native | Web x / 微信小程序 x / Android 4.71 / iOS(VDOM) x / iOS(Vapor) 5.21 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.0（部分支持，见上） | 使用原生渲染 |
+| space | string |   | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(string)*<br/>显示连续空格 |
+| 合法值 | 兼容性 | 描述 |
+| :- |  :-: | :- |
+| ensp | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 中文字符空格一半大小 |
+| emsp | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 中文字符空格大小 |
+| nbsp | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 根据字体设置的空格大小 |
+| user-select | boolean | false | Web 5.25 / 微信小程序 4.41 / Android(VDOM) 3.9 / Android(Vapor) 5.25 / iOS(VDOM) 4.11 / iOS(Vapor) 5.25 / HarmonyOS(VDOM) 4.61 / HarmonyOS(Vapor) 5.25 | 文本是否可选，该属性会使节点显示为 block |
+| selection-handle-color | string | "#4285F4FF" | Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.22 / HarmonyOS x（部分支持，见上） | 选择区域高亮手柄颜色 |
+| selection-background-color | string | "#33B5E566" | Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.22 / HarmonyOS x（部分支持，见上） | 选择区域高亮背景颜色 |
+| @itemclick | (event: [UniRichTextItemClickEvent](#unirichtextitemclickevent)) => void |   | Web 4.0 / 微信小程序 x / Android 3.9 / iOS 4.11 / HarmonyOS 4.71（部分支持，见上） | 内容点击事件 |
+
+### 节点列表数据结构
+``` json
+{
+    name: "p", // 标签名
+    attrs: {
+        style: "color: red;" // 样式
+    },
+    children: [ // 子节点
+        {
+            text: "hello uni-app x" // 文本节点
+        },
+        {
+            name: "img", // img 标签
+            attrs: {
+                src: "https://web-ext-storage.dcloud.net.cn/uni-app-x/logo.ico",
+                width: "100",
+                height: "100"
+            }
+        },
+        {
+            name: "a", // a 标签
+            attrs: {
+                href: "https://www.dcloud.io"
+            }
+        }
+    ]
+}
+```
+
+### 事件
+#### UniRichTextItemClickEvent
+
+```mermaid
+graph LR
+  
+UniRichTextItemClickEvent -- Extends --> UniEvent
+  style UniEvent color:#42b983
+  click UniEvent "https://doc.dcloud.net.cn/uni-app-x/component/common.html#unievent"
+```
+##### UniRichTextItemClickEvent 的属性值
+| 名称 | 类型 | 必填 |
+| :- | :- | :- |
+| detail | **UniRichTextItemClickEventDetail** | 是 |
+| 名称 | 类型 | 必备 | 描述 |
+| :- | :- | :- | :- |
+| src | string | 否 | \图片链接 |
+| href | string | 否 | \<a/>超链接 |
+
+### 子组件 @children-tags
+不可以嵌套组件
+
+### 示例
+示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/component/rich-text/rich-text.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/component/rich-text/rich-text.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/rich-text/rich-text
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/component/rich-text/rich-text
+
+>示例
+```vue
+<template>
+  
+  <scroll-view class="uni-theme-root" style="flex: 1;">
+  
+		<view class="rich-text-page uni-padding-wrap uni-common-mt uni-theme-root">
+      <navigator url="/pages/component/rich-text/rich-text-tags" class="uni-btn-v">
+        <button>rich-text渲染单个HTML标签示例</button>
+      </navigator>
+      <navigator url="/pages/component/rich-text/rich-text-complex" class="uni-btn-v">
+        <button>rich-text渲染复杂HTML示例</button>
+      </navigator>
+      <navigator url="/pages/component/rich-text/rich-text-highlight" class="uni-btn-v">
+        <button>rich-text高亮覆盖测试</button>
+      </navigator>
+      
+        <navigator url="/pages/template/long-rich-text/long-rich-text" class="uni-btn-v">
+          <button class="uni-btn">组件性能测试</button>
+        </navigator>
+      
+			<view class="uni-title">
+				<button type="default" @click="changeText">修改文本内容</button>
+			</view>
+			<view class="uni-title">
+				<button type="default" @click="changeFontSize">切换 font-size ({{ data.currentFontSize }})</button>
+			</view>
+			<view class="uni-title">
+				<button type="default" @click="changeColor">切换 color ({{ data.currentColor }})</button>
+			</view>
+			<view class="uni-title">
+				<button type="default" @click="changeLineHeight">切换 line-height ({{ data.currentLineHeight }})</button>
+			</view>
+			<view class="uni-title">
+				<button type="default" @click="changeFontFamily">切换 font-family ({{ data.currentFontFamily }})</button>
+			</view>
+			<view class="text-box" id="rich-text-parent" @click="richTextParentClick">
+				<rich-text id='rich-text' class="rich-text-content" :style="data.richTextStyle" :nodes="data.text" mode="native">
+				</rich-text>
+				<view>
+					<text class="rich-text-label">rich-text-parent</text>
+					<text id='rich-text-str' class="rich-text-label">{{ data.richTextStr }}</text>
+				</view>
+			</view>
+			<view class="uni-title">
+				<text class="uni-subtitle-text">user-select</text>
+			</view>
+			<view class="text-box2">
+				<rich-text id="user-select-rich-text" class="rich-text-content" style="height: 80px;" :user-select="data.userSelect" :nodes="data.text"></rich-text>
+			</view>
+		</view>
+  
+  </scroll-view>
+  
+</template>
+
+
+
+<style>
+	.text-box {
+		padding: 20px 0;
+		background-color: #ffffff;
+	}
+
+	.text-box2 {
+		top: 20px;
+		background-color: #ffffff;
+	}
+
+	.rich-text-label {
+		color: #333333;
+	}
+</style>
+
+```
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.basic-content.rich-text)
+- [参见uni-app相关文档](https://uniapp.dcloud.io/component/rich-text.html)
+- [微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=rich-text&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=rich-text&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=rich-text&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=rich-text&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=rich-text)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=rich-text&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)
+
+## rich-text的mode介绍
+
+rich-text组件，在web和小程序本身就是webview渲染的。在app平台，有2种mode，web和native。
+
+- web模式：每个rich-text都使用一个web-view来渲染内容。初始化速度略慢，页面中有多个rich-text组件就意味着有多个web-view，会很卡。
+- native模式：在app蒸汽模式下使用c语言自绘。它的流畅度无与伦比，可以瞬间加载5万字长文多图混排、流畅的快速滚动不白屏不掉帧。[详见评测](../app-vapor.md#rich-text)。
+但是它的模块体积较大，每个cpu类型需要8M的so库。
+
+- 原生markdown渲染：官方提供了markdown解析，动态拼接原生组件的方案，在[uni-ai x开源项目](https://ext.dcloud.net.cn/plugin?id=23902)中可以体验
+
+## 全局样式
+
+rich-text组件的style或class中，支持如下几个css属性，用于设置全局样式。全局样式优先级低于rich-text内容中的样式设置。
+
+- font-size
+- font-family
+- line-height
+- color App平台需HBuilderX5.21+
+
+## 调整历史@change
+
+在4.7版以前，Android是kotlin实现的rich-text，但与web规范拉齐度较低；iOS使用的是web-view；鸿蒙使用的是系统的rich-text，但该rich-text也是基于web-view实现且有细节问题。
+
+从uni-app x4.7+，3个App平台统一使用web-view实现。鸿蒙平台直接替换了之前的实现，而Android平台则新增了mode属性配置，默认是web-view实现，但也可以通过mode=native继续使用之前的原生kotlin方式。
+
+App平台从蒸汽模式开始，新增了c语言实现的 rich-text。3个App平台均支持 mode 属性配置，默认是 `web-view` 实现，可以通过设置 `mode=native` 使用原生方式。Android蒸汽模式的rich-text mode native，也从kotlin实现统一改为更快的c语言实现。
+
+## Bug & Tips@tips
+- rich-text不支持video组件，如果涉及video，需拆分文本内容，在video前后各放置一个rich-text组件
+- 小程序的rich-text功能要弱一些，不支持rich-text中子内容的点击事件，如有这类需求，在小程序平台需要条件编译使用[mp-html](https://ext.dcloud.net.cn/search?q=mp-html)
+- App-Android 平台 vdom模式 且 mode=native 时，HTML String 类型的``不支持自定义宽高，默认以 rich-text 组件宽度为基准等比缩放；节点列表类型的``支持自定义宽高。
+- App-Harmony App-iOS 平台 且 mode=native 时，暂不支持 `selectable` 属性。

package/data/uniappx/component/root-portal.md

@@ -0,0 +1,26 @@
+::: sourceCode
+## root-portal
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | 4.41 | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> |
+
+### 属性 
+| 名称 | 类型 | 兼容性 | 描述 |
+| :- | :- |  :-: | :- |
+| enable | boolean | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(boolean)*<br/>是否从页面中脱离出来 |
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.wx.other.root-portal)
+- [微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/component/root-portal.html)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=root-portal&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=root-portal&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=root-portal&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=root-portal&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=root-portal)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=root-portal&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)

package/data/uniappx/component/scale-gesture-handler.md

@@ -0,0 +1,45 @@
+::: sourceCode
+## scale-gesture-handler
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | 4.41 | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> |
+
+### 属性 
+| 名称 | 类型 | 兼容性 | 描述 |
+| :- | :- |  :-: | :- |
+| tag | string | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(string)*<br/>声明手势协商时的组件标识 |
+| worklet:ongesture | eventhandler | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(eventhandler)*<br/>手势识别成功的回调 |
+| 合法值 | 兼容性 | 描述 |
+| :- |  :-: | :- |
+| state | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 手势状态 |
+| focalX | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 中心点相对于全局的X坐标 |
+| focalY | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 中心点相对于全局的Y坐标 |
+| focalDeltaX | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 相对上一次，中心点在X轴方向移动的坐标 |
+| focalDeltaY | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 相对上一次，中心点在Y轴方向移动的坐标 |
+| scale | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 放大或缩小的比例 |
+| horizontalScale | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | scale的横向分量 |
+| verticalScale | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | scale的纵向分量 |
+| rotation | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 旋转角（单位：弧度） |
+| velocityX | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 手指离开屏幕时的横向速度（pixel per second) |
+| velocityY | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 手指离开屏幕时的纵向速度（pixel per second) |
+| pointerCount | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 跟踪的手指数 |
+| worklet:should-response-on-move | callback | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(callback)*<br/>手指移动过程中手势是否响应 |
+| worklet:should-accept-gesture | callback | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(callback)*<br/>手势是否应该被识别 |
+| simultaneous-handlers | Array.&lt;string&gt; | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(Array.&lt;string&gt;)*<br/>声明可同时触发的手势节点 |
+| native-view | string | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(string)*<br/>代理的原生节点类型 |
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.wx.skyline.scale-gesture-handler)
+- [微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/component/scale-gesture-handler.html)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=scale-gesture-handler&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=scale-gesture-handler&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=scale-gesture-handler&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=scale-gesture-handler&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=scale-gesture-handler)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=scale-gesture-handler&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)