tmui-cli 2.0.2 → 2.0.4

package/data/uniappx/component/uni-ui-x/uni-fab-button.md

@@ -0,0 +1,137 @@
+source: https://gitcode.com/dcloud/uni-ui-x/tree/alpha/uni_modules/uni-fab-button
+
+::: sourceCode
+## uni-fab-button
+
+悬浮加号按钮组件
+
+> 本 Component 是 uni ext component，需下载插件：[uni-fab-button](https://ext.dcloud.net.cn/plugin?id=27846)
+
+悬浮加号按钮
+
+本组件常用于页面中右下角悬浮的、里面有一个加号的圆形按钮。
+
+组件的根view默认是一个圆形，蓝色背景（#007AFF），并带有阴影。使用组件时注意组件的父容器要留出阴影的空间，避免被裁剪。
+
+组件的二级view是2个view交叉组成的加号。其中垂直的view是通过transform变换方向实现的。
+
+组件的属性为 plus-class，它是一个externalClass，用于外部修改组件内部的、组成加号的2个view的样式。
+
+组件中加号的默认样式为背景白色、粗细为2px、尺寸为40%。
+
+### 注意
+- 鸿蒙平台按下fab-button不缩写的问题，需升级到HBuilderX 5.09+解决
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 5.07 | 5.07 | 5.07 | 5.07 | 5.07 |
+
+### 属性 
+| 名称 | 类型 | 默认值 | 描述 |
+| :- | :- | :- | :- |
+| plusClass | string(string.ClassString) | "" | 加号图标的自定义样式类，用于调整加号颜色、尺寸等样式 |
+| @click | Event |   | 点击事件，参数为事件对象，类型为 UniPointerEvent |
+
+### 示例
+示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/uni-ui/fab-button/fab-button.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/uni-ui/fab-button/fab-button.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/uni-ui/fab-button/fab-button
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/uni-ui/fab-button/fab-button
+
+>示例
+```vue
+<template>
+	<view style="flex: 1;position: relative;padding: 15px 15px 0 15px;">
+		<text class="label first-label">标准uni-fab-button</text>
+		<uni-fab-button></uni-fab-button>
+		<text class="label">自定义fab样式</text>
+		<uni-fab-button class="custom-class"></uni-fab-button>
+		<text class="label">自定义plus样式</text>
+		<uni-fab-button plus-class="custom-plus-class"></uni-fab-button>
+		<text class="label">自定义fab和plus样式，变成一个16px的纯+</text>
+		<uni-fab-button class="transparent" plus-class="black-plus"></uni-fab-button>
+		<text class="label">可移动uni-fab-button</text>
+		<view class="move-fab-placeholder">
+			<view id="move-fab" class="move-fab" @touchstart="onTouchStart" @touchmove="onTouchMove" @touchend="updateMoveData" @touchcancel="updateMoveData">
+				<uni-fab-button></uni-fab-button>
+			</view>
+		</view>
+		<view
+			class="right-bottom"
+			:class="rightBottomFabPressed ? 'fab-pressed' : ''"
+			@touchstart="rightBottomFabPressed = true"
+			@touchend="rightBottomFabPressed = false"
+			@touchcancel="rightBottomFabPressed = false">
+			<uni-fab-button @click="handleClick"></uni-fab-button>
+		</view>
+	</view>
+</template>
+
+<style>
+	.label {
+		color: var(--text-color, #333333);
+		margin-top: 24px;
+		margin-bottom: 12px;
+	}
+	.first-label {
+		margin-top: 0;
+	}
+	.custom-class{
+		background-color: green;
+		width: 20px;
+		height: 20px;
+	}
+	.custom-plus-class {
+		background-color: brown;
+		width: 80%;
+		height: 5px;
+		border-radius: 0px;
+	}
+	.transparent {
+		width: 16px;
+		height: 16px;
+		background-color: transparent;
+		box-shadow: none;
+	}
+	.black-plus {
+		background-color: black;
+		width: 100%;
+		height: 2px;
+		border-radius: 0px;
+	}
+	.move-fab-placeholder {
+		width: 56px;
+		height: 56px;
+	}
+	.move-fab {
+		width: 56px;
+		height: 56px;
+		align-items: center;
+		justify-content: center;
+	}
+	.right-bottom {
+		position: absolute;
+		right: 38px;
+		bottom: 38px;
+		width: 56px;
+		height: 56px;
+		align-items: center;
+		justify-content: center;
+		opacity: 1;
+		transform: scale(1);
+		transform-origin: center center;
+		transition-property: transform, opacity;
+		transition-duration: 140ms;
+		transition-timing-function: cubic-bezier(0.2, 0, 0.2, 1);
+	}
+	.fab-pressed {
+		opacity: 0.9;
+		transform: scale(0.95);
+	}
+</style>
+
+```
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=uni-ui-x.uni-fab-button)

package/data/uniappx/component/uni-ui-x/uni-index-bar.md

@@ -0,0 +1,224 @@
+source: https://gitcode.com/dcloud/uni-ui-x/tree/alpha/uni_modules/uni-index-bar
+
+::: sourceCode
+## uni-index-bar
+
+索引列表组件
+
+> 本 Component 是 uni ext component，需下载插件：[uni-index-bar](https://ext.dcloud.net.cn/plugin?id=27847)
+
+### 介绍
+
+本组件以竖排方式显示字母索引，常悬浮或固定于列表右侧，用户通过点击或滑动索引条上的字母索引，触发 `select` 事件。在该事件中通过代码驱动指定的列表滚动到该字母索引所在的位置。
+
+本组件为绝对定位，默认垂直居中于父容器右侧。
+
+本组件不包括 list-view 组件，需要配合 list-view 使用。list-view 中需要有对应索引的 list-item，且这些 list-item 需要有 id 属性，可以通过 `scroll-into-view` 属性或 `scrollTop` 属性跳转。
+
+本组件包括一个指示器（indicator）子组件。当用户手指触摸在索引条上的某个字母时，在触摸的字母左边悬浮显示一个水滴形气泡，箭头指向当前触摸的字母。
+
+### 基本用法
+
+```html
+<view style="flex: 1; position: relative;">
+  <list-view ref="listRef" style="flex: 1;">
+    
+  </list-view>
+  <uni-index-bar @select="onSelect"></uni-index-bar>
+</view>
+```
+
+```uts
+const onSelect = (index: string) => {
+  // 处理索引选择，滚动列表到对应位置
+}
+```
+
+### 事件
+
+| 事件名 | 说明 | 回调参数 |
+|--------|------|----------|
+| select | 选择索引时触发 | index: string - 当前选择的索引字符 |
+
+### 外部样式类
+
+| 类名 | 说明 |
+|------|------|
+| indicator-view-class | 指示器容器样式，可自定义气泡背景色等 |
+| indicator-text-class | 指示器文字样式，可自定义文字颜色等 |
+
+### 示例
+
+#### 自定义索引
+
+```html
+<uni-index-bar :indexs="'☆\nA\nB\nC\n#'" @select="onSelect"></uni-index-bar>
+```
+
+#### 自定义样式
+
+```html
+<uni-index-bar
+  indicator-view-class="custom-indicator"
+  indicator-text-class="custom-indicator-text"
+  style="color: aqua;"
+  @select="onSelect">
+</uni-index-bar>
+```
+
+```css
+.custom-indicator {
+  background-color: #007aff;
+}
+.custom-indicator-text {
+  color: #ffff00;
+}
+```
+
+#### 配合 list-view 使用
+
+```html
+<view style="flex: 1; position: relative;">
+  <list-view ref="listRef" style="flex: 1;" :scroll-into-view="indexViewID">
+    <template v-for="group in cityGroups" :key="group.index">
+      <list-item :id="'idx-' + group.index" type="header">
+        <view class="group-header">
+          <text>{{ group.index }}</text>
+        </view>
+      </list-item>
+      <list-item v-for="city in group.cities" :key="city.id" type="city">
+        <view class="city-item">
+          <text>{{ city.name }}</text>
+        </view>
+      </list-item>
+    </template>
+  </list-view>
+  <uni-index-bar :indexs="indexList" @select="onSelect"></uni-index-bar>
+</view>
+```
+
+```uts
+const indexList = cityGroups.map((g): string => g.index).join('\n')
+const indexViewID = ref("")
+
+const onSelect = (index: string) => {
+  indexViewID.value = 'idx-' + index
+}
+```
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 5.07 | 5.08 | 5.07 | 5.07 | 5.07 |
+
+### 属性 
+| 名称 | 类型 | 默认值 | 描述 |
+| :- | :- | :- | :- |
+| indexs | string | "A\nB\nC\nD\nE\nF\nG\nH\nI\nJ\nK\nL\nM\nN\nO\nP\nQ\nR\nS\nT\nU\nV\nW\nX\nY\nZ" | 索引字符列表，使用换行符 \n 分隔，每行作为一个索引项 |
+| indicatorViewClass | string(string.ClassString) | "" | 指示器容器的自定义样式类，触摸时显示当前索引的气泡 |
+| indicatorTextClass | string(string.ClassString) | "" | 指示器内文字的自定义样式类 |
+| @select | Event |   | 选择索引时触发，参数为当前选择的索引字符，类型为 string |
+
+### 示例
+示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/uni-ui/index-bar/index-bar.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/uni-ui/index-bar/index-bar.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/uni-ui/index-bar/index-bar
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/uni-ui/index-bar/index-bar
+
+>示例
+```vue
+<template>
+	<view style="flex: 1; flex-direction: column; position: relative;">
+		
+			<view class="control-bar">
+				<button class="control-btn" @click="toggleStyle">{{ data.useCustomStyle ? '默认样式' : '自定义样式' }}</button>
+				<button class="control-btn" @click="toggleIndexs">{{ data.useCustomIndexs ? '根据数据设索引' : '自定义索引' }}</button>
+			</view>
+			<list-view ref="listRef" style="flex: 1;" class="city-list" :scroll-into-view="data.indexViewID" :scroll-with-animation="data.scrollWithAnimation">
+			<sticky-section v-for="group in cityGroups" :key="group.index" :id="'idx-' + group.index"
+			
+			:preload="true"
+			
+			>
+				<sticky-header>
+					<view class="group-header">
+						<text class="group-header-text">{{ group.index }}</text>
+					</view>
+				</sticky-header>
+				
+				<list-item v-for="city in group.cities" :key="city.pinyin" type="city">
+					<view class="city-item">
+						<text class="city-name">{{ city.name }}</text>
+					</view>
+				</list-item>
+			</sticky-section>
+		</list-view>
+			<uni-index-bar
+				:indexs="currentIndexs"
+				:indicator-view-class="data.useCustomStyle ? 'custom-indicator' : ''"
+				:indicator-text-class="data.useCustomStyle ? 'custom-indicator-text' : ''"
+				:style="data.useCustomStyle ? 'color: aqua;' : ''"
+				@select="onSelect">
+			</uni-index-bar>
+	</view>
+</template>
+
+<style>
+	.control-bar {
+		flex-direction: row;
+		padding: 10px;
+		background-color: var(--background-color, #f5f5f5);
+	}
+
+	.control-btn {
+		flex: 1;
+		margin: 0 5px;
+		font-size: 14px;
+	}
+
+	.group-header {
+		background-color: var(--background-color, #f5f5f5);
+		padding-left: 16px;
+		padding-top: 8px;
+		padding-bottom: 8px;
+	}
+
+	.group-header-text {
+		font-size: 14px;
+		color: var(--text-color, #333333);
+		opacity: 0.7;
+		font-weight: bold;
+	}
+
+	.city-list {
+		background-color: var(--list-background-color, #ffffff);
+	}
+
+	.city-item {
+		padding-left: 16px;
+		padding-top: 14px;
+		padding-bottom: 14px;
+		background-color: var(--list-background-color, #ffffff);
+		border-bottom-width: 1px;
+		border-bottom-color: var(--border-color, #eeeeee);
+		border-bottom-style: solid;
+	}
+
+	.city-name {
+		font-size: 16px;
+		color: var(--text-color, #333333);
+	}
+
+	.custom-indicator {
+		background-color: #007aff;
+	}
+
+	.custom-indicator-text {
+		color: #ffff00;
+	}
+</style>
+
+```
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=uni-ui-x.uni-index-bar)

package/data/uniappx/component/uni-ui-x/uni-link.md

@@ -0,0 +1,190 @@
+source: https://gitcode.com/dcloud/uni-ui-x/tree/alpha/uni_modules/uni-link
+
+::: sourceCode
+## uni-link
+
+链接组件
+
+> 本 Component 是 uni ext component，需下载插件：[uni-link](https://ext.dcloud.net.cn/plugin?id=27898)
+
+打开web链接组件。点击后通过内置或外部浏览器打开链接，加载 `href` 属性中配置的 URL。
+
+- `target="_self"` 时，使用 `uni_modules/uni-link-x/pages/link-webview` 页面内的 `web-view` 打开链接。
+  * 注意小程序需要将域名加入应用的域名白名单。
+- `target="_blank"` 时，
+  * APP平台调用手机浏览器打开链接
+  * Web调用 `window.open(url, '_blank')`
+  * 小程序平台无法打开手机浏览器，此时会走到失败回退逻辑中
+
+  `target="_blank"`失败时，可以通过组件属性`blank-fallback`来控制失败后的回退处理策略，`blank-fallback`属性有3个值：
+
+  1. turn-self ：使用_self方式打开。此值为默认值。也就是 `target="_blank"` 时，小程序下默认转到内置浏览器打开。
+  2. copy-link-modal ：复制链接并弹框提醒。会复制URL到剪贴板中，并弹框提示用户在外部浏览器中打开。
+  3. none ：不回退。会触发组件的error事件。
+
+- 开发者也可以通过条件编译组合使用，比如APP平台使用`_black`，小程序平台使用`_self`
+
+常见失败原因：
+- 安装本组件时未在项目的pages.json中注册组件的内置页面。（HBuilderX导入本组件到项目下时会弹框提醒注册内置页面）
+- 小程序平台未将域名加入应用的域名白名单。
+- iOS运行基座未包括openSchema插件，仅在无xcode时运行会触发。打包其实不会发生此错误。
+- app平台，有些手机系统会弹框询问用户是否允许app打开浏览器，如果用户点了拒绝，这种情况没有失败回调。但有种判断方式是app的onHide生命周期是否触发，如果没有触发，那么意味着并没有启动系统浏览器。
+
+### 基本用法
+
+```html
+<uni-link href="https://uniapp.dcloud.net.cn">uni-app x 文档
+</uni-link>
+```
+
+### Events
+
+| 事件名 | 说明 | 回调参数 |
+| --- | --- | --- |
+| error | 打开失败时触发 | `message: string` |
+
+### 依赖
+
+`APP` 平台依赖 `uts-openSchema`。`uni-link` 已在 `uni_modules/uni-link-x/package.json` 中声明该依赖。
+
+组件目录下有 `pages_init.json`，会向应用的 pages.json 中注册组件中自带的内置浏览器页面。如在HBuilderX中弹框询问是否将组件中的页面注册到项目pages.json中时，请选择同意。
+
+### 示例页面
+
+`/pages/uni-ui/link/link`
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 5.07 | 5.07 | 5.07 | 5.07 | 5.07 |
+
+### 属性 
+| 名称 | 类型 | 默认值 | 描述 |
+| :- | :- | :- | :- |
+| href | string | "" | 链接地址，点击组件时要打开的 URL |
+| target | _blank \| _self | "_self" | 打开方式。"_self" 在当前应用内置 webview 中打开；"_blank" 在外部浏览器中打开（小程序端会复制链接提示用户外部打开） |
+| 合法值 |
+| :- |
+| _blank |
+| _self |
+| blankFallback | turn-self \| copy-link-modal \| none | "turn-self" | `target="_blank"`失败时，可以通过本属性控制失败回退策略。"turn-self"使用_self方式打开；"copy-link-modal"复制链接并弹框提醒；"none"不回退，触发失败回调 |
+| 合法值 |
+| :- |
+| turn-self |
+| copy-link-modal |
+| none |
+| @error | Event |   |   |
+
+### 示例
+示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/uni-ui/link/link.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/uni-ui/link/link.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/uni-ui/link/link
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/uni-ui/link/link
+
+>示例
+```vue
+<template>
+  <scroll-view class="page">
+    <view class="section">
+      <text class="section-title">基础用法</text>
+      <view class="link-block">
+        <uni-link href="https://uniapp.dcloud.net.cn" @error="onError">https://uniapp.dcloud.net.cn</uni-link>
+      </view>
+    </view>
+
+    <view class="section">
+      <text class="section-title">自定义样式</text>
+      <view class="link-block">
+        <uni-link href="https://doc.dcloud.net.cn/uni-app-x/" class="custom-link" @error="onError" >
+          查看 uni-app x 文档
+        </uni-link>
+      </view>
+    </view>
+
+    <view class="section">
+      <text class="section-title">target="_self" (默认)</text>
+      <view class="link-block">
+        <uni-link href="https://uniapp.dcloud.net.cn" target="_self" @error="onError" >
+          在内置 webview 中打开
+        </uni-link>
+      </view>
+    </view>
+
+    <view class="section">
+      <text class="section-title">target="_blank"</text>
+      <view class="link-block">
+        <uni-link href="https://uniapp.dcloud.net.cn" target="_blank" @error="onError" >
+          使用外部浏览器打开
+        </uni-link>
+      </view>
+      <text class="tip-text">APP 使用 openSchema 插件，小程序回退到内置 webview 打开，Web 打开新页签</text>
+    </view>
+
+    <view class="section">
+      <text class="section-title">target="_blank" 且 失败回退策略为复制URL</text>
+      <view class="link-block">
+        <uni-link href="https://uniapp.dcloud.net.cn" target="_blank" blankFallback="copy-link-modal" @error="onError" >
+          使用外部浏览器打开
+        </uni-link>
+      </view>
+      <text class="tip-text">使用外部浏览器打开失败时，回退为复制URL到剪贴板且弹框提示用户手动粘贴URL到浏览器</text>
+    </view>
+
+    <view class="section">
+      <text class="section-title">失败示例</text>
+      <view class="link-block">
+        <uni-link href="" @error="onError" >
+          空链接（触发 error）
+        </uni-link>
+      </view>
+    </view>
+
+    <view class="section">
+      <text class="section-title">最近事件</text>
+      <text class="log-text">{{ data.lastEvent }}</text>
+    </view>
+  </scroll-view>
+</template>
+
+<style>
+  .page {
+    flex: 1;
+    padding: 12px;
+  }
+
+  .section {
+    margin-bottom: 20px;
+  }
+
+  .section-title {
+    font-size: 16px;
+    color: var(--text-color, #333333);
+  }
+
+  .link-block {
+    margin-top: 8px;
+  }
+
+  .tip-text {
+    margin-top: 4px;
+    font-size: 12px;
+    color: var(--text-color, #333333);
+    opacity: 0.6;
+  }
+
+  .custom-link {
+    color: #007aff;
+    font-size: 20px;
+  }
+
+  .log-text {
+    margin-top: 8px;
+    font-size: 13px;
+    color: #007aff;
+  }
+</style>
+
+```
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=uni-ui-x.uni-link)