@ray-js/components 0.6.8 → 0.6.9

package/lib/Camera/Camera.d.ts

@@ -0,0 +1,2 @@
+declare const Camera: () => JSX.Element;
+export default Camera;

package/lib/Camera/Camera.js

@@ -0,0 +1,7 @@
+import React from 'react'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+
+var Camera = function () {
+  return /*#__PURE__*/React.createElement("div", null, "web\u7AEF\u6682\u672A\u5B9E\u73B0");
+};
+
+export default Camera;

package/lib/Camera/Camera.thing.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { CameraProps } from '@ray-js/adapter';
+declare const Camera: React.FC<CameraProps>;
+export default Camera;

package/lib/Camera/Camera.thing.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { Camera as RemaxCamera } from '@ray-js/adapter';
+
+var Camera = function (props) {
+  return /*#__PURE__*/React.createElement(RemaxCamera, props);
+};
+
+export default Camera;

package/lib/Camera/Camera.wechat.d.ts

@@ -0,0 +1,2 @@
+declare function Camera(): JSX.Element;
+export default Camera;

package/lib/Camera/Camera.wechat.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { View } from '@ray-js/components'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+
+function Camera() {
+  return /*#__PURE__*/React.createElement(View, null, "\u5FAE\u4FE1\u5C0F\u7A0B\u5E8F\u7AEF\u6682\u672A\u5B9E\u73B0");
+}
+
+export default Camera;

package/lib/Camera/index.d.ts

@@ -0,0 +1,3 @@
+import Camera from './Camera';
+export type { CameraProps } from '@ray-js/adapter';
+export default Camera;

package/lib/Camera/index.js

@@ -0,0 +1,2 @@
+import Camera from './Camera';
+export default Camera;

package/lib/Camera/index.md

@@ -0,0 +1,48 @@
+---
+nav:
+  title: 组件
+  path: /components
+group:
+  title: 视图容器
+hide: true
+---
+
+## camera
+
+> 基础库 2.2.0 开始支持, 低版本需做兼容处理。
+
+系统相机。相关 API：[ty.createCameraContext](https://developer.tuya.com/cn/miniapp/api/media/camera/create-camera-context)。这是基于异层渲染的原生组件, 请注意 [原生组件使用限制](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。
+
+## 导入
+
+```js
+import { Camera } from '@ray-js/components'
+```
+
+### 属性说明
+
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| mode | string | normal | 否 | 应用模式，只在初始化时有效，不能动态变更 |
+| resolution | string | medium | 否 | 分辨率，不支持动态修改；可选值有 `low`: 低，`medium`: 中，`high`: 高 |
+| device-position | string | back | 否 | 摄像头朝向, 可选值有`front`: 前置, `back`: 后置 |
+| flash | string | auto | 否 | 闪光灯, 可选值有`auto`: 自动, `on`: 打开, `off`: 关闭, `torch`: 常亮 |
+| border-width | number | 0 | 否 | 边框的宽度, 单位 px |
+| border-style | string | solid | 否 | 边框的样式, 可选值: solid 和 dashed |
+| border-color | string | #ffffff | 否 | 边框的颜色, 必须为十六进制格式 |
+| border-radius | number | 0 | 否 | 边框的圆角, 单位 px |
+| border-radius-top-left | number |  | 否 | 边框的左上角圆角大小, 单位 px |
+| border-radius-top-right | number |  | 否 | 边框的右上角圆角大小, 单位 px |
+| border-radius-bottom-left | number |  | 否 | 边框的左下角圆角大小, 单位 px |
+| border-radius-bottom-right | number |  | 否 | 边框的右下角圆角大小, 单位 px |
+| background-color | string | #ffffff | 否 | 背景颜色, 必须为十六进制格式 |
+| onBindstop | eventhandle |  | 否 | 摄像头在非正常终止时触发，如退出后台等情况 |
+| onError | eventhandle |  | 否 | 用户不允许使用摄像头时触发 |
+| onInitdone | eventhandle |  | 否 | 相机初始化完成时触发，`e.detail = {maxZoom}` |
+
+### Bug & Tip
+
+1. tip：同一页面只能插入一个 `camera` 组件。
+2. tip：开发者工具上不支持。
+3. tip：相关原理请参考 [基于异层渲染的原生组件](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。
+4. tip：请注意 [原生组件使用限制](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。

package/lib/IpcPlayer/IpcPlayer.d.ts

@@ -1,4 +1,2 @@
-import { FC } from 'react';
-import { IpcPlayerProps } from './props';
-declare const IpcPlayer: FC<IpcPlayerProps>;
+declare const IpcPlayer: () => JSX.Element;
 export default IpcPlayer;

package/lib/IpcPlayer/IpcPlayer.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from 'react'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
 
 var IpcPlayer = function () {
   return /*#__PURE__*/React.createElement("div", null, "web\u7AEF\u6682\u672A\u5B9E\u73B0");

package/lib/IpcPlayer/IpcPlayer.thing.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
-import { IpcPlayerProps } from './props';
+import { IpcPlayerProps } from '@ray-js/adapter';
 declare const IpcPlayer: React.FC<IpcPlayerProps>;
 export default IpcPlayer;

package/lib/IpcPlayer/IpcPlayer.wechat.d.ts

@@ -1,3 +1,2 @@
-import { IpcPlayerProps } from './props';
-declare function IpcPlayer(props: IpcPlayerProps): JSX.Element;
+declare function IpcPlayer(): JSX.Element;
 export default IpcPlayer;

package/lib/IpcPlayer/IpcPlayer.wechat.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { View } from '@ray-js/components';
+import { View } from '@ray-js/components'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
 
 function IpcPlayer() {
   return /*#__PURE__*/React.createElement(View, null, "\u5FAE\u4FE1\u5C0F\u7A0B\u5E8F\u7AEF\u6682\u672A\u5B9E\u73B0");

package/lib/IpcPlayer/index.d.ts

@@ -1,3 +1,3 @@
 import IpcPlayer from './IpcPlayer';
-export * from './props';
+export type { IpcPlayerProps } from '@ray-js/adapter';
 export default IpcPlayer;

package/lib/IpcPlayer/index.js

@@ -1,3 +1,2 @@
 import IpcPlayer from './IpcPlayer';
-export * from './props';
 export default IpcPlayer;

package/lib/IpcPlayer/index.md

@@ -39,13 +39,13 @@ import { IpcPlayer } from '@ray-js/components'
 | border-color | string | #ffffff | 否 | 边框的颜色, 必须为十六进制格式 |
 | border-radius | number/string | 0 | 否 | 边框的圆角, 单位 px |
 | background-color | string | #ffffff | 否 | 背景颜色, 必须为十六进制格式 |
-| bind:connectchange | eventhandle |  | 否 | 当连接状态发生变化时触发，detail = { state }, state: 0 表示连接成功 |
-| bind:previewchange | eventhandle |  | 否 | 当预览状态发生变化时触发，detail = { state }, state: 1 表示开始预览成功, state: 0 表示结束预览成功 |
-| bind:onlinechange | eventhandle |  | 否 | 当 ipc 设备在线状态变化时触发，detail = { online }, online: true 表示在线, online: false 表示离线或断电 |
-| bind:initdone | eventhandle |  | 否 | 初始化完成时触发 |
-| bind:zoomchange | eventhandle |  | 否 | 视频缩放比例及当前倍数变化，detail = { zoomLevel }, zoomLevel 为缩放比例 |
-| bind:videotap | eventhandle |  | 否 | 点击视频时触发 |
-| bind:error | eventhandle |  | 否 | 当状态异层时触发 error 事件，detail = { "errCode": 错误码 , "errMsg": 错误描述 }, 错误码见下表 |
+| onConnectchange | eventhandle |  | 否 | 当连接状态发生变化时触发，detail = { state }, state: 0 表示连接成功 |
+| onPreviewchange | eventhandle |  | 否 | 当预览状态发生变化时触发，detail = { state }, state: 1 表示开始预览成功, state: 0 表示结束预览成功 |
+| onOnlinechange | eventhandle |  | 否 | 当 ipc 设备在线状态变化时触发，detail = { online }, online: true 表示在线, online: false 表示离线或断电 |
+| onInitdone | eventhandle |  | 否 | 初始化完成时触发 |
+| onZoomchange | eventhandle |  | 否 | 视频缩放比例及当前倍数变化，detail = { zoomLevel }, zoomLevel 为缩放比例 |
+| onVideotap | eventhandle |  | 否 | 点击视频时触发 |
+| onError | eventhandle |  | 否 | 当状态异层时触发 error 事件，detail = { "errCode": 错误码 , "errMsg": 错误描述 }, 错误码见下表 |
 
 **错误码**
 

package/lib/Map/Map.d.ts

@@ -0,0 +1,2 @@
+declare const Map: () => JSX.Element;
+export default Map;

package/lib/Map/Map.js

@@ -0,0 +1,7 @@
+import React from 'react'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+
+var Map = function () {
+  return /*#__PURE__*/React.createElement("div", null, "web\u7AEF\u6682\u672A\u5B9E\u73B0");
+};
+
+export default Map;

package/lib/Map/Map.thing.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { MapProps } from '@ray-js/adapter';
+declare const Map: React.FC<MapProps>;
+export default Map;

package/lib/Map/Map.thing.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { Map as RemaxMap } from '@ray-js/adapter';
+
+var Map = function (props) {
+  return /*#__PURE__*/React.createElement(RemaxMap, props);
+};
+
+export default Map;

package/lib/Map/Map.wechat.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { MapProps } from '@ray-js/adapter';
+declare const Map: React.FC<MapProps>;
+export default Map;

package/lib/Map/Map.wechat.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { Map as RemaxMap } from '@ray-js/adapter';
+
+var Map = function (props) {
+  return /*#__PURE__*/React.createElement(RemaxMap, props);
+};
+
+export default Map;

package/lib/Map/index.d.ts

@@ -0,0 +1,3 @@
+import Map from './Map';
+export type { MapProps } from '@ray-js/adapter';
+export default Map;

package/lib/Map/index.js

@@ -0,0 +1,2 @@
+import Map from './Map';
+export default Map;

package/lib/Map/index.md

@@ -0,0 +1,126 @@
+---
+nav:
+  title: 组件
+  path: /components
+group:
+  title: 视图容器
+hide: true
+---
+
+## map
+
+> 基础库 2.0.12 开始支持, 低版本需做兼容处理。依赖 **MapKit** 插件, 插件版本 >= 2.2.2。
+
+## 导入
+
+```js
+import { Map } from '@ray-js/components'
+```
+
+地图。相关 API：[ty.createMapContext](https://developer.tuya.com/cn/miniapp/api/media/map/create-map-context)。这是基于异层渲染的原生组件, 请注意 [原生组件使用限制](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。
+
+### 属性说明
+
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| longitude | number |  | 是 | 中心经度 |
+| latitude | number |  | 是 | 中心纬度 |
+| scale | number | 16 | 否 | 缩放级别，取值范围为 4-19 |
+| min-scale | number | 4 | 否 | 最小缩放级别 |
+| max-scale | number | 19 | 否 | 最大缩放级别 |
+| markers | `Array<marker>` |  | 否 | 标记点 |
+| polyline | `Array.<polyline>` |  | 否 | 路线 |
+| circles | `Array.<circle>` |  | 否 | 圆 |
+| polygons | `Array.<polygon>` |  | 否 | 多边形 |
+| border-width | number | 0 | 否 | 边框的宽度, 单位 px |
+| border-style | string | solid | 否 | 边框的样式, 可选值: solid 和 dashed |
+| border-color | string | #ffffff | 否 | 边框的颜色, 必须为十六进制格式 |
+| border-radius | number | 0 | 否 | 边框的圆角, 单位 px |
+| border-radius-top-left | number |  | 否 | 边框的左上角圆角大小, 单位 px |
+| border-radius-top-right | number |  | 否 | 边框的右上角圆角大小, 单位 px |
+| border-radius-bottom-left | number |  | 否 | 边框的左下角圆角大小, 单位 px |
+| border-radius-bottom-right | number |  | 否 | 边框的右下角圆角大小, 单位 px |
+| background-color | string | #ffffff | 否 | 背景颜色, 必须为十六进制格式 |
+| onMarkertap | eventhandle |  | 否 | 点击标记点时触发，e.detail = {markerId} |
+| onCallouttap | eventhandle |  | 否 | 点击标记点对应的气泡时触发 e.detail = {markerId} |
+| onRegionchange | eventhandle |  | 否 | 视野发生变化时触发 |
+| onInitdone | eventhandle |  | 否 | 初始化完成时触发 |
+
+### regionchange 返回值
+
+视野改变时，regionchange 会触发两次，返回的 type 值分别为 begin 和 end。
+
+### marker
+
+标记点用于在地图上显示标记的位置。
+
+| 属性名 | 说明 | 类型 | 必填 | 备注 |
+| --- | --- | --- | --- | --- |
+| id | 标记点 ID | number | 是 | marker 点击事件回调会返回此 id。 |
+| longitude | 经度 | number | 是 | 浮点数，范围 -180 ~ 180 |
+| latitude | 纬度 | number | 是 | 浮点数，范围 -90 ~ 90 |
+| title | 标注点名 | string | 否 | 点击时显示，callout 存在时将被忽略 |
+| styleId | 气泡样式类型 ID | string | 否 | 由原生实现的 marker 样式类型 id |
+| callout | 标记点上方的气泡窗口数据源 | object | 否 | 支持的属性见下表，可识别换行符。存在 styleId 时，根据所选样式类型传入属性 |
+| iconPath | 显示的图标 | string | 是 | 项目目录下的图片路径，支持网络路径、代码包路径 |
+| rotate | 旋转角度 | number | 否 | 顺时针旋转的角度，范围 0 ~ 360，默认为 0 |
+| width | 标注图标宽度 | number/string | 否 | 默认为图片实际宽度 |
+| height | 标注图标高度 | number/string | 否 | 默认为图片实际高度 |
+
+### marker 上的气泡 callout
+
+| 属性名       | 说明                                      | 类型   |
+| ------------ | ----------------------------------------- | ------ |
+| content      | 文本                                      | string |
+| color        | 文本颜色                                  | string |
+| fontSize     | 文字大小                                  | number |
+| borderRadius | 边框圆角                                  | number |
+| borderWidth  | 边框宽度                                  | number |
+| borderColor  | 边框颜色                                  | string |
+| bgColor      | 背景色                                    | string |
+| padding      | 文本边缘留白                              | number |
+| textAlign    | 文本对齐方式。有效值: left, right, center | string |
+| anchorX      | 横向偏移量，向右为正数                    | number |
+| anchorY      | 纵向偏移量，向下为正数                    | number |
+
+### polyline
+
+指定一系列坐标点，从数组第一项连线至最后一项。
+
+| 属性名     | 说明       | 类型    | 必填 | 备注                          |
+| ---------- | ---------- | ------- | ---- | ----------------------------- |
+| points     | 经纬度数组 | array   | 是   | [{latitude: 0, longitude: 0}] |
+| color      | 线的颜色   | string  | 否   | 十六进制                      |
+| width      | 线的宽度   | number  | 否   |                               |
+| dottedLine | 是否虚线   | boolean | 否   | 默认 false                    |
+
+### circle
+
+在地图上显示圆
+
+| 属性名      | 说明       | 类型   | 必填 | 备注                    |
+| ----------- | ---------- | ------ | ---- | ----------------------- |
+| latitude    | 纬度       | number | 是   | 浮点数，范围 -90 ~ 90   |
+| longitude   | 经度       | number | 是   | 浮点数，范围 -180 ~ 180 |
+| color       | 描边的颜色 | string | 否   | 十六进制                |
+| fillColor   | 填充颜色   | string | 否   | 十六进制                |
+| radius      | 半径       | number | 是   |                         |
+| strokeWidth | 描边的宽度 | number | 否   |                         |
+
+### polygon
+
+指定一系列坐标点，根据 points 坐标数据生成闭合多边形
+
+| 属性名      | 说明       | 类型   | 必填 | 备注                          |
+| ----------- | ---------- | ------ | ---- | ----------------------------- |
+| points      | 经纬度数组 | array  | 是   | [{latitude: 0, longitude: 0}] |
+| strokeWidth | 描边的宽度 | number | 否   |                               |
+| strokeColor | 描边的颜色 | string | 否   | 十六进制                      |
+| fillColor   | 填充颜色   | string | 否   | 十六进制                      |
+
+### Bug & Tip
+
+1. tip：地图组件的经纬度必填, 如果不填经纬度则默认值是北京的经纬度。
+2. tip：开发者工具上是通过 WebView 模拟的与真机存在差异，请以真机效果为主。
+3. tip：相关原理请参考 [基于异层渲染的原生组件](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。
+4. tip：请注意 [原生组件使用限制](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。

package/lib/NativeVideo/NativeVideo.d.ts

@@ -0,0 +1,2 @@
+declare const NativeVideo: () => JSX.Element;
+export default NativeVideo;

package/lib/NativeVideo/NativeVideo.js

@@ -0,0 +1,7 @@
+import React from 'react'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+
+var NativeVideo = function () {
+  return /*#__PURE__*/React.createElement("div", null, "web\u7AEF\u6682\u672A\u5B9E\u73B0");
+};
+
+export default NativeVideo;

package/lib/NativeVideo/NativeVideo.thing.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { NativeVideoProps } from '@ray-js/adapter';
+declare const NativeVideo: React.FC<NativeVideoProps>;
+export default NativeVideo;

package/lib/NativeVideo/NativeVideo.thing.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { NativeVideo as RemaxNativeVideo } from '@ray-js/adapter';
+
+var NativeVideo = function (props) {
+  return /*#__PURE__*/React.createElement(RemaxNativeVideo, props);
+};
+
+export default NativeVideo;

package/lib/NativeVideo/NativeVideo.wechat.d.ts

@@ -0,0 +1,2 @@
+declare function NativeVideo(): JSX.Element;
+export default NativeVideo;

package/lib/NativeVideo/NativeVideo.wechat.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { View } from '@ray-js/components'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+
+function NativeVideo() {
+  return /*#__PURE__*/React.createElement(View, null, "\u5FAE\u4FE1\u5C0F\u7A0B\u5E8F\u7AEF\u6682\u672A\u5B9E\u73B0");
+}
+
+export default NativeVideo;

package/lib/NativeVideo/index.d.ts

@@ -0,0 +1,3 @@
+import NativeVideo from './NativeVideo';
+export type { NativeVideoProps } from '@ray-js/adapter';
+export default NativeVideo;

package/lib/NativeVideo/index.js

@@ -0,0 +1,2 @@
+import NativeVideo from './NativeVideo';
+export default NativeVideo;

package/lib/NativeVideo/index.md

@@ -0,0 +1,74 @@
+---
+nav:
+  title: 组件
+  path: /components
+group:
+  title: 视图容器
+hide: true
+---
+
+## native-video
+
+> 基础库 2.5.0 开始支持, 低版本需做兼容处理。
+
+## 导入
+
+```js
+import { NativeVideo } from '@ray-js/components'
+```
+
+视频。相关 API: [ty.createNativeVideoContext](https://developer.tuya.com/cn/miniapp/api/media/native-video/create-native-video-context)。这是基于异层渲染的原生组件, 请注意 [原生组件使用限制](https://developer.tuya.com/cn/miniapp/ /component/native-component/native-component)。
+
+| 属性 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| src | string |  | 是 | 要播放视频的资源地址，支持网络路径; 注意分区部署情况下,视频是否支持访问 |
+| duration | number |  | 否 | 指定视频时长，单位秒 s |
+| controls | boolean | true | 否 | 是否显示默认播放控件（播放/暂停按钮、播放进度、时间） |
+| autoplay | boolean | false | 否 | 是否自动播放 |
+| loop | boolean | false | 否 | 是否循环播放 |
+| muted | boolean | false | 否 | 是否静音播放 |
+| initial-time | number | 0 | 否 | 指定视频初始播放位置 |
+| show-fullscreen-btn | boolean | true | 否 | 是否显示全屏按钮 |
+| show-play-btn | boolean | true | 否 | 是否显示视频底部控制栏的播放按钮 |
+| show-center-play-btn | boolean | true | 否 | 是否显示视频中间的播放按钮 |
+| object-fit | string | contain | 否 | 当视频大小与 video 容器大小不一致时，视频的表现形式 |
+| poster | string |  | 否 | 视频封面的图片网络资源地址 |
+| show-mute-btn | boolean | false | 否 | 是否显示静音按钮 |
+| border-width | number | 0 | 否 | 边框的宽度, 单位 px |
+| border-style | string | solid | 否 | 边框的样式, 可选值: solid 和 dashed |
+| border-color | string | #ffffff | 否 | 边框的颜色, 必须为十六进制格式 |
+| border-radius | number | 0 | 否 | 边框的圆角, 单位 px |
+| border-radius-top-left | number |  | 否 | 边框的左上角圆角大小, 单位 px |
+| border-radius-top-right | number |  | 否 | 边框的右上角圆角大小, 单位 px |
+| border-radius-bottom-left | number |  | 否 | 边框的左下角圆角大小, 单位 px |
+| border-radius-bottom-right | number |  | 否 | 边框的右下角圆角大小, 单位 px |
+| background-color | string | #ffffff | 否 | 背景颜色, 必须为十六进制格式 |
+| onPlay | eventhandle |  | 否 | 当开始/继续播放时触发 play 事件 |
+| onPause | eventhandle |  | 否 | 当暂停播放时触发 pause 事件 |
+| onEnded | eventhandle |  | 否 | 当播放到末尾时触发 ended 事件 |
+| onTimeupdate | eventhandle |  | 否 | 播放进度变化时触发，event.detail = {currentTime, duration} 。 |
+| onFullscreenchange | eventhandle |  | 否 | 视频进入和退出全屏时触发，event.detail = {fullScreen, direction}，direction 有效值为 vertical 或 horizontal |
+| onWaiting | eventhandle |  | 否 | 视频出现缓冲时触发 |
+| onError | eventhandle |  | 否 | 视频播放出错时触发 |
+| onProgress | eventhandle |  | 否 | 加载进度变化时触发，只支持一段加载。event.detail = {buffered}，百分比 |
+| onLoadedmetadata | eventhandle |  | 否 | 视频元数据加载完成时触发。event.detail = {width, height, duration} |
+| onControlstoggle | eventhandle |  | 否 | 切换 controls 显示隐藏时触发。event.detail = {show} |
+| onSeekcomplete | eventhandler |  | 否 | seek 完成时触发 (position iOS 单位 s, Android 单位 ms) |
+|  |
+
+#### object-fit 的合法值
+
+| 值      | 说明 |
+| ------- | ---- |
+| contain | 包含 |
+| fill    | 填充 |
+| cover   | 覆盖 |
+
+### Bug & Tip
+
+1. tip：`native-video` 默认宽度 300px、高度 225px，可通过 tyss 设置宽高。
+2. tip：相关原理请参考 [基于异层渲染的原生组件](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。
+3. tip：请注意 [原生组件使用限制](https://developer.tuya.com/cn/miniapp/component/native-component/native-component)。
+4. tip：`native-video` 支持三种视频格式：MP4。
+
+- MP4 = MPEG 4 文件使用 H264 视频编解码器和 AAC 音频编解码器

package/lib/WebView/WebView.d.ts

@@ -0,0 +1,2 @@
+declare const WebView: () => JSX.Element;
+export default WebView;

package/lib/WebView/WebView.js

@@ -0,0 +1,7 @@
+import React from 'react'; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+
+var WebView = function () {
+  return /*#__PURE__*/React.createElement("div", null, "web\u7AEF\u6682\u672A\u5B9E\u73B0");
+};
+
+export default WebView;

package/lib/WebView/WebView.thing.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { WebViewProps } from '@ray-js/adapter';
+declare const WebView: React.FC<WebViewProps>;
+export default WebView;

package/lib/WebView/WebView.thing.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { WebView as RemaxWebView } from '@ray-js/adapter';
+
+var WebView = function (props) {
+  return /*#__PURE__*/React.createElement(RemaxWebView, props);
+};
+
+export default WebView;

package/lib/WebView/WebView.wechat.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { WebViewProps } from '@ray-js/adapter';
+declare const WebView: React.FC<WebViewProps>;
+export default WebView;

package/lib/WebView/WebView.wechat.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { WebView as RemaxWebView } from '@ray-js/adapter';
+
+var WebView = function (props) {
+  return /*#__PURE__*/React.createElement(RemaxWebView, props);
+};
+
+export default WebView;

package/lib/WebView/index.d.ts

@@ -0,0 +1,3 @@
+import WebView from './WebView';
+export type { WebViewProps } from '@ray-js/adapter';
+export default WebView;

package/lib/WebView/index.js

@@ -0,0 +1,2 @@
+import WebView from './WebView';
+export default WebView;

package/lib/WebView/index.md

@@ -0,0 +1,33 @@
+---
+nav:
+  title: 组件
+  path: /components
+group:
+  title: 视图容器
+hide: true
+---
+
+## web-view
+
+> 基础库 2.6.0 开始支持, 低版本需做兼容处理。
+
+## 导入
+
+```js
+import { WebView } from '@ray-js/components'
+```
+
+### 功能描述
+
+承载网页的容器。会自动铺满整个小程序页面。
+
+> 注意：当页面存在 web-view 标签时，其他标签将不展示，且不支持设置任何样式！
+
+### 属性说明
+
+| 属性名 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| src | string |  | 否 | webview 指向网页的链接。需登录[小程序管理后台](https://iot.tuya.com/miniapp)配置业务域名。 |
+| onMessage | eventhandle |  | 否 | 网页向小程序 postMessage 时，会在特定时机（小程序后退、组件销毁、分享）触发并收到消息。e.detail = { data }，data 是多次 postMessage 的参数组成的数组 |
+| onLoad | eventhandle |  | 否 | 网页加载成功时候触发此事件。e.detail = { src } |
+| onError | eventhandle |  | 否 | 网页加载失败的时候触发此事件。e.detail = { url, fullUrl }，其中 fullUrl 为加载失败时的完整 url |

package/lib/index.d.ts

@@ -31,3 +31,7 @@ export { default as PickerViewColumn } from './PickerViewColumn';
 export { default as PageContainer } from './PageContainer';
 export { default as IpcPlayer } from './IpcPlayer';
 export { default as CoverView } from './CoverView';
+export { default as NativeVideo } from './NativeVideo';
+export { default as WebView } from './WebView';
+export { default as Map } from './Map';
+export { default as Camera } from './Camera';

package/lib/index.js

@@ -30,4 +30,8 @@ export { default as PickerView } from './PickerView';
 export { default as PickerViewColumn } from './PickerViewColumn';
 export { default as PageContainer } from './PageContainer';
 export { default as IpcPlayer } from './IpcPlayer';
-export { default as CoverView } from './CoverView';
+export { default as CoverView } from './CoverView';
+export { default as NativeVideo } from './NativeVideo';
+export { default as WebView } from './WebView';
+export { default as Map } from './Map';
+export { default as Camera } from './Camera';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/components",
-  "version": "0.6.8",
+  "version": "0.6.9",
   "description": "Ray basic components",
   "keywords": [
     "ray"
@@ -26,7 +26,7 @@
   "dependencies": {
     "@ray-core/macro": "^0.0.x",
     "@ray-core/wechat": "^0.0.x",
-    "@ray-js/framework-shared": "^0.6.8",
+    "@ray-js/framework-shared": "^0.6.9",
     "clsx": "^1.1.1",
     "core-js": "^3.19.1",
     "hooks": "^0.3.2",
@@ -35,7 +35,7 @@
     "style-to-object": "^0.3.0"
   },
   "devDependencies": {
-    "@ray-js/cli": "^0.6.8"
+    "@ray-js/cli": "^0.6.9"
   },
   "maintainers": [
     {
@@ -43,6 +43,6 @@
       "email": "tuyafe@tuya.com"
     }
   ],
-  "gitHead": "fc83de18208c48d8323de586f13e3860712c91a3",
+  "gitHead": "b069b03dabfc6151fc772a2308243b4b86cb5545",
   "repository": {}
 }

package/lib/IpcPlayer/props.d.ts

@@ -1,47 +0,0 @@
-import { BaseProps } from '../types';
-import { BaseEvent } from '@ray-js/adapter/src/types/component';
-export declare type IpcPlayerEventType = {
-    type: string;
-    value?: any;
-    origin: BaseEvent;
-};
-export declare type IpcPlayerProps = BaseProps & {
-    deviceId: string;
-    autoplay?: boolean;
-    muted?: boolean;
-    clarity?: 'normal' | 'hd';
-    soundMode?: 'speaker' | 'ear';
-    orientation?: 'vertical' | 'horizontal';
-    objectFit?: 'contain' | 'fillCrop';
-    autoPauseIfNavigate?: boolean;
-    autoPauseIfOpenNative?: boolean;
-    rotateZ?: number;
-    scalable?: boolean;
-    scaleMultiple?: number;
-    ptzControllable?: boolean;
-    borderWidth?: number | string;
-    borderStyle?: 'solid' | 'dashed';
-    borderColor?: string;
-    borderRadius?: number | string;
-    backgroundColor?: string;
-    onConnectchange?: (event: {
-        state: number;
-    }) => void;
-    onPreviewchange?: (event: {
-        state: number;
-    }) => void;
-    onOnlinechange?: (event: {
-        online: boolean;
-    }) => void;
-    onInitdone?: () => void;
-    onZoomchange?: (event: {
-        zoomLevel: number;
-    }) => void;
-    onVideotap?: () => void;
-    onError?: (event: {
-        errCode: number | string;
-        errMsg: string;
-    }) => void;
-    updateLayout?: any;
-};
-export declare const defaultIpcPlayerProps: Partial<IpcPlayerProps>;

package/lib/IpcPlayer/props.js

@@ -1,20 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-export var defaultIpcPlayerProps = {
-  deviceId: '',
-  autoplay: false,
-  clarity: 'normal',
-  soundMode: 'speaker',
-  orientation: 'vertical',
-  objectFit: 'contain',
-  autoPauseIfNavigate: true,
-  autoPauseIfOpenNative: true,
-  rotateZ: 0,
-  scalable: true,
-  scaleMultiple: 0,
-  ptzControllable: true,
-  borderWidth: 0,
-  borderStyle: 'solid',
-  borderColor: '#ffffff',
-  borderRadius: 0,
-  backgroundColor: '#ffffff'
-};