@ray-js/components 0.4.6-beta-3 → 0.4.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/Button/Button.js +1 -1
- package/lib/Button/Button.web.js +1 -1
- package/lib/Checkbox/Checkbox.js +1 -1
- package/lib/Checkbox/Checkbox.web.js +1 -1
- package/lib/CheckboxGroup/CheckboxGroup.js +1 -1
- package/lib/CheckboxGroup/CheckboxGroup.web.js +1 -1
- package/lib/DatePicker/DatePicker.js +1 -1
- package/lib/DatePicker/DatePicker.web.js +1 -1
- package/lib/Form/Form.js +1 -1
- package/lib/Form/Form.web.js +1 -1
- package/lib/Image/Image.js +1 -1
- package/lib/Image/Image.web.js +1 -1
- package/lib/Input/Input.js +1 -1
- package/lib/Input/Input.web.js +1 -1
- package/lib/Label/Label.js +1 -1
- package/lib/Label/Label.web.js +1 -1
- package/lib/MovableArea/MovableArea.android.js +1 -0
- package/lib/MovableArea/MovableArea.d.ts +4 -0
- package/lib/MovableArea/MovableArea.ios.js +1 -0
- package/lib/MovableArea/MovableArea.js +11 -0
- package/lib/MovableArea/MovableArea.tuya.js +11 -0
- package/lib/MovableArea/MovableArea.web.d.ts +4 -0
- package/lib/MovableArea/MovableArea.web.js +11 -0
- package/lib/MovableArea/MovableArea.wechat.js +11 -0
- package/lib/MovableArea/index.android.js +1 -0
- package/lib/MovableArea/index.d.ts +3 -0
- package/lib/MovableArea/index.ios.js +1 -0
- package/lib/MovableArea/index.js +3 -0
- package/lib/MovableArea/index.md +23 -0
- package/lib/MovableArea/index.tuya.js +3 -0
- package/lib/MovableArea/index.web.js +3 -0
- package/lib/MovableArea/index.wechat.js +3 -0
- package/lib/MovableArea/props.android.js +1 -0
- package/lib/MovableArea/props.d.ts +19 -0
- package/lib/MovableArea/props.ios.js +1 -0
- package/lib/MovableArea/props.js +3 -0
- package/lib/MovableArea/props.tuya.js +3 -0
- package/lib/MovableArea/props.web.js +3 -0
- package/lib/MovableArea/props.wechat.js +3 -0
- package/lib/MovableView/MovableView.android.js +1 -0
- package/lib/MovableView/MovableView.d.ts +4 -0
- package/lib/MovableView/MovableView.ios.js +1 -0
- package/lib/MovableView/MovableView.js +11 -0
- package/lib/MovableView/MovableView.tuya.js +11 -0
- package/lib/MovableView/MovableView.web.d.ts +4 -0
- package/lib/MovableView/MovableView.web.js +40 -0
- package/lib/MovableView/MovableView.wechat.js +11 -0
- package/lib/MovableView/index.android.js +1 -0
- package/lib/MovableView/index.d.ts +3 -0
- package/lib/MovableView/index.ios.js +1 -0
- package/lib/MovableView/index.js +3 -0
- package/lib/MovableView/index.md +61 -0
- package/lib/MovableView/index.tuya.js +3 -0
- package/lib/MovableView/index.web.js +3 -0
- package/lib/MovableView/index.wechat.js +3 -0
- package/lib/MovableView/props.android.js +1 -0
- package/lib/MovableView/props.d.ts +109 -0
- package/lib/MovableView/props.ios.js +1 -0
- package/lib/MovableView/props.js +15 -0
- package/lib/MovableView/props.tuya.js +15 -0
- package/lib/MovableView/props.web.js +15 -0
- package/lib/MovableView/props.wechat.js +15 -0
- package/lib/PageContainer/PageContainer.android.js +1 -1
- package/lib/PageContainer/PageContainer.ios.js +1 -1
- package/lib/PageContainer/PageContainer.js +1 -1
- package/lib/PageContainer/PageContainer.web.js +1 -1
- package/lib/Picker/Picker.js +1 -1
- package/lib/Picker/Picker.web.js +1 -1
- package/lib/PickerView/PickerView.js +1 -1
- package/lib/PickerView/PickerView.web.js +1 -1
- package/lib/PickerViewColumn/PickerViewColumn.js +1 -1
- package/lib/PickerViewColumn/PickerViewColumn.web.js +1 -1
- package/lib/Radio/Radio.js +1 -1
- package/lib/Radio/Radio.web.js +1 -1
- package/lib/RadioGroup/RadioGroup.js +2 -2
- package/lib/RadioGroup/RadioGroup.web.js +2 -2
- package/lib/RichText/RichText.web.js +1 -1
- package/lib/ScrollView/ScrollView.js +1 -1
- package/lib/ScrollView/ScrollView.web.js +1 -1
- package/lib/Slider/Slider.js +1 -1
- package/lib/Slider/Slider.web.js +1 -1
- package/lib/Swiper/Swiper.js +2 -2
- package/lib/Swiper/Swiper.web.js +2 -2
- package/lib/SwiperItem/SwiperItem.android.js +1 -1
- package/lib/SwiperItem/SwiperItem.ios.js +1 -1
- package/lib/SwiperItem/SwiperItem.js +1 -1
- package/lib/SwiperItem/SwiperItem.web.js +1 -1
- package/lib/Switch/Switch.js +1 -1
- package/lib/Switch/Switch.web.js +1 -1
- package/lib/Text/Text.js +1 -1
- package/lib/Text/Text.web.js +1 -1
- package/lib/Textarea/Textarea.js +49 -103
- package/lib/Textarea/Textarea.web.js +49 -103
- package/lib/TimePicker/TimePicker.js +1 -1
- package/lib/TimePicker/TimePicker.web.js +1 -1
- package/lib/View/View.js +1 -1
- package/lib/View/View.web.js +1 -1
- package/lib/utils/handleProps.android.js +1 -1
- package/lib/utils/handleProps.ios.js +1 -1
- package/lib/utils/handleProps.js +29 -10
- package/lib/utils/handleProps.tuya.js +29 -10
- package/lib/utils/handleProps.web.js +29 -10
- package/lib/utils/handleProps.wechat.js +29 -10
- package/package.json +5 -5
package/lib/Button/Button.js
CHANGED
package/lib/Button/Button.web.js
CHANGED
package/lib/Checkbox/Checkbox.js
CHANGED
@@ -3,7 +3,7 @@ import handleProps from '../utils/handleProps';
|
|
3
3
|
|
4
4
|
var Checkbox = function (props) {
|
5
5
|
// @ts-ignore
|
6
|
-
return /*#__PURE__*/React.createElement("
|
6
|
+
return /*#__PURE__*/React.createElement("v-checkbox", handleProps(props));
|
7
7
|
};
|
8
8
|
|
9
9
|
Checkbox.displayName = 'Checkbox';
|
@@ -3,7 +3,7 @@ import handleProps from '../utils/handleProps';
|
|
3
3
|
|
4
4
|
var Checkbox = function (props) {
|
5
5
|
// @ts-ignore
|
6
|
-
return /*#__PURE__*/React.createElement("
|
6
|
+
return /*#__PURE__*/React.createElement("v-checkbox", handleProps(props));
|
7
7
|
};
|
8
8
|
|
9
9
|
Checkbox.displayName = 'Checkbox';
|
@@ -29,7 +29,7 @@ var CheckboxGroup = function (props) {
|
|
29
29
|
return (
|
30
30
|
/*#__PURE__*/
|
31
31
|
// @ts-ignore
|
32
|
-
React.createElement("
|
32
|
+
React.createElement("v-checkbox-group", _extends({
|
33
33
|
ref: currentNode
|
34
34
|
}, handleProps(props)), children || function renderOptions() {
|
35
35
|
return options.map(function (item, index) {
|
@@ -29,7 +29,7 @@ var CheckboxGroup = function (props) {
|
|
29
29
|
return (
|
30
30
|
/*#__PURE__*/
|
31
31
|
// @ts-ignore
|
32
|
-
React.createElement("
|
32
|
+
React.createElement("v-checkbox-group", _extends({
|
33
33
|
ref: currentNode
|
34
34
|
}, handleProps(props)), children || function renderOptions() {
|
35
35
|
return options.map(function (item, index) {
|
@@ -50,7 +50,7 @@ var DatePicker = function (props) {
|
|
50
50
|
return (
|
51
51
|
/*#__PURE__*/
|
52
52
|
// @ts-ignore
|
53
|
-
React.createElement("
|
53
|
+
React.createElement("v-picker", _extends({}, handleProps(props), handlers, {
|
54
54
|
ref: currentNode,
|
55
55
|
mode: "date"
|
56
56
|
}), children)
|
@@ -50,7 +50,7 @@ var DatePicker = function (props) {
|
|
50
50
|
return (
|
51
51
|
/*#__PURE__*/
|
52
52
|
// @ts-ignore
|
53
|
-
React.createElement("
|
53
|
+
React.createElement("v-picker", _extends({}, handleProps(props), handlers, {
|
54
54
|
ref: currentNode,
|
55
55
|
mode: "date"
|
56
56
|
}), children)
|
package/lib/Form/Form.js
CHANGED
@@ -29,7 +29,7 @@ var Form = function (props) {
|
|
29
29
|
target: currentNode
|
30
30
|
}); // @ts-ignore
|
31
31
|
|
32
|
-
return /*#__PURE__*/React.createElement("
|
32
|
+
return /*#__PURE__*/React.createElement("v-form", _extends({
|
33
33
|
ref: currentNode
|
34
34
|
}, handleProps(restProps)));
|
35
35
|
};
|
package/lib/Form/Form.web.js
CHANGED
@@ -29,7 +29,7 @@ var Form = function (props) {
|
|
29
29
|
target: currentNode
|
30
30
|
}); // @ts-ignore
|
31
31
|
|
32
|
-
return /*#__PURE__*/React.createElement("
|
32
|
+
return /*#__PURE__*/React.createElement("v-form", _extends({
|
33
33
|
ref: currentNode
|
34
34
|
}, handleProps(restProps)));
|
35
35
|
};
|
package/lib/Image/Image.js
CHANGED
@@ -30,7 +30,7 @@ var Image = /*#__PURE__*/React.forwardRef(function (props) {
|
|
30
30
|
return (
|
31
31
|
/*#__PURE__*/
|
32
32
|
// @ts-ignore
|
33
|
-
React.createElement("
|
33
|
+
React.createElement("v-image", _extends({}, handleProps(props), {
|
34
34
|
ref: currentNode
|
35
35
|
}))
|
36
36
|
);
|
package/lib/Image/Image.web.js
CHANGED
@@ -30,7 +30,7 @@ var Image = /*#__PURE__*/React.forwardRef(function (props) {
|
|
30
30
|
return (
|
31
31
|
/*#__PURE__*/
|
32
32
|
// @ts-ignore
|
33
|
-
React.createElement("
|
33
|
+
React.createElement("v-image", _extends({}, handleProps(props), {
|
34
34
|
ref: currentNode
|
35
35
|
}))
|
36
36
|
);
|
package/lib/Input/Input.js
CHANGED
@@ -55,7 +55,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (props) {
|
|
55
55
|
return (
|
56
56
|
/*#__PURE__*/
|
57
57
|
// @ts-ignore
|
58
|
-
React.createElement("
|
58
|
+
React.createElement("v-input", _extends({}, handleProps(restProps), {
|
59
59
|
maxlength: maxLength,
|
60
60
|
onInput: function (e) {
|
61
61
|
var _props$onInput;
|
package/lib/Input/Input.web.js
CHANGED
@@ -55,7 +55,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (props) {
|
|
55
55
|
return (
|
56
56
|
/*#__PURE__*/
|
57
57
|
// @ts-ignore
|
58
|
-
React.createElement("
|
58
|
+
React.createElement("v-input", _extends({}, handleProps(restProps), {
|
59
59
|
maxlength: maxLength,
|
60
60
|
onInput: function (e) {
|
61
61
|
var _props$onInput;
|
package/lib/Label/Label.js
CHANGED
@@ -9,7 +9,7 @@ var Label = function (props) {
|
|
9
9
|
restProps = _objectWithoutProperties(props, _excluded); // @ts-ignore
|
10
10
|
|
11
11
|
|
12
|
-
return /*#__PURE__*/React.createElement("
|
12
|
+
return /*#__PURE__*/React.createElement("v-label", _extends({
|
13
13
|
for: htmlFor
|
14
14
|
}, handleProps(restProps)));
|
15
15
|
};
|
package/lib/Label/Label.web.js
CHANGED
@@ -9,7 +9,7 @@ var Label = function (props) {
|
|
9
9
|
restProps = _objectWithoutProperties(props, _excluded); // @ts-ignore
|
10
10
|
|
11
11
|
|
12
|
-
return /*#__PURE__*/React.createElement("
|
12
|
+
return /*#__PURE__*/React.createElement("v-label", _extends({
|
13
13
|
for: htmlFor
|
14
14
|
}, handleProps(restProps)));
|
15
15
|
};
|
@@ -0,0 +1 @@
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var React=_interopRequireWildcard(require("react"));var _components=require("@ray-js/components");var _props=require("./props");var _this=this,_jsxFileName="/drone/src/packages/components/src/MovableArea/MovableArea.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var MovableArea=function(){return React.createElement(_components.Text,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:6,columnNumber:10}},"\u6682\u672A\u5B9E\u73B0");};MovableArea.defaultProps=_props.defaultMovableAreaProps;MovableArea.displayName='MovableArea';var _default=MovableArea;exports.default=_default;
|
@@ -0,0 +1 @@
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var React=_interopRequireWildcard(require("react"));var _components=require("@ray-js/components");var _props=require("./props");var _this=this,_jsxFileName="/drone/src/packages/components/src/MovableArea/MovableArea.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var MovableArea=function(){return React.createElement(_components.Text,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:6,columnNumber:10}},"\u6682\u672A\u5B9E\u73B0");};MovableArea.defaultProps=_props.defaultMovableAreaProps;MovableArea.displayName='MovableArea';var _default=MovableArea;exports.default=_default;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { Text } from '@ray-js/components';
|
3
|
+
import { defaultMovableAreaProps } from './props';
|
4
|
+
|
5
|
+
var MovableArea = function () {
|
6
|
+
return /*#__PURE__*/React.createElement(Text, null, "\u6682\u672A\u5B9E\u73B0");
|
7
|
+
};
|
8
|
+
|
9
|
+
MovableArea.defaultProps = defaultMovableAreaProps;
|
10
|
+
MovableArea.displayName = 'MovableArea';
|
11
|
+
export default MovableArea;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { Text } from '@ray-js/components';
|
3
|
+
import { defaultMovableAreaProps } from './props';
|
4
|
+
|
5
|
+
var MovableArea = function () {
|
6
|
+
return /*#__PURE__*/React.createElement(Text, null, "\u6682\u672A\u5B9E\u73B0");
|
7
|
+
};
|
8
|
+
|
9
|
+
MovableArea.defaultProps = defaultMovableAreaProps;
|
10
|
+
MovableArea.displayName = 'MovableArea';
|
11
|
+
export default MovableArea;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import "core-js/modules/es.object.assign.js";
|
2
|
+
import React from 'react';
|
3
|
+
import handleProps from '../utils/handleProps';
|
4
|
+
import { defaultMovableAreaProps } from './props';
|
5
|
+
export var MovableArea = function (props) {
|
6
|
+
var restProps = Object.assign({}, props); // @ts-ignore
|
7
|
+
|
8
|
+
return /*#__PURE__*/React.createElement("v-movable-area", handleProps(restProps));
|
9
|
+
};
|
10
|
+
MovableArea.defaultProps = defaultMovableAreaProps;
|
11
|
+
export default MovableArea;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { Text } from '@ray-js/components';
|
3
|
+
import { defaultMovableAreaProps } from './props';
|
4
|
+
|
5
|
+
var MovableArea = function () {
|
6
|
+
return /*#__PURE__*/React.createElement(Text, null, "\u6682\u672A\u5B9E\u73B0");
|
7
|
+
};
|
8
|
+
|
9
|
+
MovableArea.defaultProps = defaultMovableAreaProps;
|
10
|
+
MovableArea.displayName = 'MovableArea';
|
11
|
+
export default MovableArea;
|
@@ -0,0 +1 @@
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={};exports.default=void 0;var _MovableArea=_interopRequireDefault(require("./MovableArea"));var _props=require("./props");Object.keys(_props).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_props[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function get(){return _props[key];}});});var _default=_MovableArea.default;exports.default=_default;
|
@@ -0,0 +1 @@
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={};exports.default=void 0;var _MovableArea=_interopRequireDefault(require("./MovableArea"));var _props=require("./props");Object.keys(_props).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_props[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function get(){return _props[key];}});});var _default=_MovableArea.default;exports.default=_default;
|
@@ -0,0 +1,23 @@
|
|
1
|
+
---
|
2
|
+
nav:
|
3
|
+
title: 组件
|
4
|
+
path: /components
|
5
|
+
group:
|
6
|
+
title: 视图容器
|
7
|
+
---
|
8
|
+
|
9
|
+
# MovableArea
|
10
|
+
|
11
|
+
MovableView 的可移动区域。
|
12
|
+
|
13
|
+
## 导入
|
14
|
+
|
15
|
+
```js
|
16
|
+
import { MovableArea } from '@ray-js/components'
|
17
|
+
```
|
18
|
+
|
19
|
+
## 属性说明
|
20
|
+
|
21
|
+
| 属性 | 类型 | 默认值 | 必填 | 说明 | 支持平台 |
|
22
|
+
| --- | --- | --- | --- | --- | --- |
|
23
|
+
| scaleArea | boolean | false | 否 | 当里面的 MovableView 设置为支持双指缩放时,设置此值可将缩放手势生效区域修改为整个 MovableArea | Web |
|
@@ -0,0 +1 @@
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.defaultMovableAreaProps=void 0;var defaultMovableAreaProps={scaleArea:false};exports.defaultMovableAreaProps=defaultMovableAreaProps;
|
@@ -0,0 +1,19 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { BaseProps } from '../types';
|
3
|
+
export interface MovableAreaProps extends BaseProps {
|
4
|
+
/**
|
5
|
+
* @description.en React Children
|
6
|
+
* @description.zh React 子元素
|
7
|
+
* @default undefined
|
8
|
+
*/
|
9
|
+
children?: React.ReactElement;
|
10
|
+
/**
|
11
|
+
* @description.en When the MovableView inside is set to support two-finger zoom, setting this value modifies the area where the zoom gesture takes effect to the entire movable-area
|
12
|
+
* @description.zh 当里面的 MovableView 设置为支持双指缩放时,设置此值可将缩放手势生效区域修改为整个 movable-area
|
13
|
+
* @default false
|
14
|
+
*/
|
15
|
+
scaleArea?: boolean;
|
16
|
+
}
|
17
|
+
export declare const defaultMovableAreaProps: {
|
18
|
+
scaleArea: boolean;
|
19
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.defaultMovableAreaProps=void 0;var defaultMovableAreaProps={scaleArea:false};exports.defaultMovableAreaProps=defaultMovableAreaProps;
|
@@ -0,0 +1 @@
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var React=_interopRequireWildcard(require("react"));var _components=require("@ray-js/components");var _props=require("./props");var _this=this,_jsxFileName="/drone/src/packages/components/src/MovableView/MovableView.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var MovableView=function(){return React.createElement(_components.Text,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:6,columnNumber:10}},"\u6682\u672A\u5B9E\u73B0");};MovableView.displayName='MovableView';MovableView.defaultProps=_props.defaultMovableViewProps;var _default=MovableView;exports.default=_default;
|
@@ -0,0 +1 @@
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var React=_interopRequireWildcard(require("react"));var _components=require("@ray-js/components");var _props=require("./props");var _this=this,_jsxFileName="/drone/src/packages/components/src/MovableView/MovableView.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var MovableView=function(){return React.createElement(_components.Text,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:6,columnNumber:10}},"\u6682\u672A\u5B9E\u73B0");};MovableView.displayName='MovableView';MovableView.defaultProps=_props.defaultMovableViewProps;var _default=MovableView;exports.default=_default;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { Text } from '@ray-js/components';
|
3
|
+
import { defaultMovableViewProps } from './props';
|
4
|
+
|
5
|
+
var MovableView = function () {
|
6
|
+
return /*#__PURE__*/React.createElement(Text, null, "\u6682\u672A\u5B9E\u73B0");
|
7
|
+
};
|
8
|
+
|
9
|
+
MovableView.displayName = 'MovableView';
|
10
|
+
MovableView.defaultProps = defaultMovableViewProps;
|
11
|
+
export default MovableView;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { Text } from '@ray-js/components';
|
3
|
+
import { defaultMovableViewProps } from './props';
|
4
|
+
|
5
|
+
var MovableView = function () {
|
6
|
+
return /*#__PURE__*/React.createElement(Text, null, "\u6682\u672A\u5B9E\u73B0");
|
7
|
+
};
|
8
|
+
|
9
|
+
MovableView.displayName = 'MovableView';
|
10
|
+
MovableView.defaultProps = defaultMovableViewProps;
|
11
|
+
export default MovableView;
|
@@ -0,0 +1,40 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
2
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
3
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
4
|
+
var _excluded = ["onChange", "onScale"];
|
5
|
+
import React from 'react';
|
6
|
+
import { useEventListener } from 'ahooks';
|
7
|
+
import handleProps from '../utils/handleProps';
|
8
|
+
import { defaultMovableViewProps } from './props';
|
9
|
+
export var MovableView = function (props) {
|
10
|
+
var onChange = props.onChange,
|
11
|
+
onScale = props.onScale,
|
12
|
+
restProps = _objectWithoutProperties(props, _excluded);
|
13
|
+
|
14
|
+
var currentNode = React.useRef(null);
|
15
|
+
useEventListener('change', function (e) {
|
16
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(_objectSpread(_objectSpread({
|
17
|
+
type: 'change'
|
18
|
+
}, e.detail), {}, {
|
19
|
+
origin: e
|
20
|
+
}));
|
21
|
+
}, {
|
22
|
+
target: currentNode
|
23
|
+
});
|
24
|
+
useEventListener('scale', function (e) {
|
25
|
+
onScale === null || onScale === void 0 ? void 0 : onScale(_objectSpread(_objectSpread({
|
26
|
+
type: 'scale'
|
27
|
+
}, e.detail), {}, {
|
28
|
+
origin: e
|
29
|
+
}));
|
30
|
+
}, {
|
31
|
+
target: currentNode
|
32
|
+
}); // @ts-ignore
|
33
|
+
|
34
|
+
return /*#__PURE__*/React.createElement("v-movable-view", _extends({
|
35
|
+
ref: currentNode
|
36
|
+
}, handleProps(restProps)));
|
37
|
+
};
|
38
|
+
MovableView.displayName = 'MovableView';
|
39
|
+
MovableView.defaultProps = defaultMovableViewProps;
|
40
|
+
export default MovableView;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { Text } from '@ray-js/components';
|
3
|
+
import { defaultMovableViewProps } from './props';
|
4
|
+
|
5
|
+
var MovableView = function () {
|
6
|
+
return /*#__PURE__*/React.createElement(Text, null, "\u6682\u672A\u5B9E\u73B0");
|
7
|
+
};
|
8
|
+
|
9
|
+
MovableView.displayName = 'MovableView';
|
10
|
+
MovableView.defaultProps = defaultMovableViewProps;
|
11
|
+
export default MovableView;
|
@@ -0,0 +1 @@
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={};exports.default=void 0;var _MovableView=_interopRequireDefault(require("./MovableView"));var _props=require("./props");Object.keys(_props).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_props[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function get(){return _props[key];}});});var _default=_MovableView.default;exports.default=_default;
|
@@ -0,0 +1 @@
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={};exports.default=void 0;var _MovableView=_interopRequireDefault(require("./MovableView"));var _props=require("./props");Object.keys(_props).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_props[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function get(){return _props[key];}});});var _default=_MovableView.default;exports.default=_default;
|
@@ -0,0 +1,61 @@
|
|
1
|
+
---
|
2
|
+
nav:
|
3
|
+
title: 组件
|
4
|
+
path: /components
|
5
|
+
group:
|
6
|
+
title: 视图容器
|
7
|
+
---
|
8
|
+
|
9
|
+
# MovableView
|
10
|
+
|
11
|
+
可移动的视图容器,在页面中可以拖拽滑动。MovableView 必须在 movable-area 组件中,并且必须是直接子节点,否则不能移动。
|
12
|
+
|
13
|
+
## 导入
|
14
|
+
|
15
|
+
```js
|
16
|
+
import { MovableView } from '@ray-js/components'
|
17
|
+
```
|
18
|
+
|
19
|
+
## 示例代码
|
20
|
+
|
21
|
+
<code src="./demos/basic.tsx" title="基本使用" background="#f2f4f6" height="500px" />
|
22
|
+
|
23
|
+
<code src="./demos/horizontal" title="只可以横向移动" background="#f2f4f6" height="500px" />
|
24
|
+
|
25
|
+
<code src="./demos/vertical.tsx" title="只可以纵向移动" background="#f2f4f6" height="500px" />
|
26
|
+
|
27
|
+
<code src="./demos/outOfBounds.tsx" title="可超出边界" background="#f2f4f6" height="500px" />
|
28
|
+
|
29
|
+
<code src="./demos/inertia.tsx" title="带有惯性" background="#f2f4f6" height="500px" />
|
30
|
+
|
31
|
+
<code src="./demos/scale.tsx" title="可缩放" background="#f2f4f6" height="500px" />
|
32
|
+
|
33
|
+
## 属性说明
|
34
|
+
|
35
|
+
| 属性名 | 类型 | 默认值 | 必填 | 说明 | 支持平台 |
|
36
|
+
| --- | --- | --- | --- | --- | --- |
|
37
|
+
| direction | string | none | 否 | MovableView 的移动方向,属性值有 all、vertical、horizontal、none | Web |
|
38
|
+
| inertia | boolean | false | 否 | MovableView 是否带有惯性 | Web |
|
39
|
+
| outOfBounds | boolean | false | 否 | 超过可移动区域后,movable-view 是否还可以移动 | Web |
|
40
|
+
| x | number | 0 | 否 | 定义 x 轴方向的偏移,如果 x 的值不在可移动范围内,会自动移动到可移动范围。改变 x 的值会触发动画 | Web |
|
41
|
+
| y | number | 0 | 否 | 定义 y 轴方向的偏移,如果 y 的值不在可移动范围内,会自动移动到可移动范围。改变 y 的值会触发动画 | Web |
|
42
|
+
| damping | number | 20 | 否 | 阻尼系数,用于控制 x 或 y 改变时的动画和过界回弹的动画,值越大移动越快 | Web |
|
43
|
+
| friction | number | 2 | 否 | 摩擦系数,用于控制惯性滑动的动画,值越大摩擦力越大,滑动越快停止;必须大于 0,否则会被设置成默认值 | Web |
|
44
|
+
| disabled | boolean | false | 否 | 是否禁用 | Web |
|
45
|
+
| scale | boolean | false | 否 | 是否支持双指缩放,默认缩放手势生效区域是在 MovableView 内 | Web |
|
46
|
+
| scaleMin | number | 0.5 | 否 | 定义缩放倍数最小值 | Web |
|
47
|
+
| scaleMax | number | 10 | 否 | 定义缩放倍数最大值 | Web |
|
48
|
+
| scaleValue | number | 1 | 否 | 定义缩放倍数,取值范围为 0.5 - 10 | Web |
|
49
|
+
| animation | boolean | true | 否 | 是否使用动画 | Web |
|
50
|
+
| onChange | eventhandle | | 否 | 拖动过程中触发的事件,event.detail = {x, y, source} | Web |
|
51
|
+
| onScale | eventhandle | | 否 | 缩放过程中触发的事件,event.detail = {x, y, scale} | Web |
|
52
|
+
|
53
|
+
**`onChange` 返回的 `source` 表示产生移动的原因**
|
54
|
+
|
55
|
+
| 值 | 说明 |
|
56
|
+
| ---------------- | -------------------- |
|
57
|
+
| touch | 拖动 |
|
58
|
+
| touchOutOfBounds | 超出移动范围 |
|
59
|
+
| outOfBounds | 超出移动范围后的回弹 |
|
60
|
+
| friction | 惯性 |
|
61
|
+
| 空字符串 | setData |
|
@@ -0,0 +1 @@
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:true});exports.defaultMovableViewProps=void 0;var defaultMovableViewProps={direction:'none',inertia:false,outOfBounds:false,x:0,y:0,damping:20,friction:2,disabled:false,scale:false,scaleMin:0.5,scaleMax:10,scaleValue:1,animation:true};exports.defaultMovableViewProps=defaultMovableViewProps;
|