taro-react-uilib 1.0.24 → 1.0.26
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/dist/components/FormInput/index.js +1 -1
- package/dist/components/FormInput/index.js.map +1 -1
- package/dist/components/Image/index.js +1 -1
- package/dist/components/Image/index.js.map +1 -1
- package/dist/components/node_modules/@babel/runtime/helpers/esm/extends.js +2 -0
- package/dist/components/node_modules/@babel/runtime/helpers/esm/extends.js.map +1 -0
- package/dist/components/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js +2 -0
- package/dist/components/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js.map +1 -0
- package/dist/components/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js +2 -0
- package/dist/components/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js.map +1 -0
- package/dist/components/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js +2 -0
- package/dist/components/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js.map +1 -0
- package/dist/components/node_modules/dom-helpers/esm/addClass.js +2 -0
- package/dist/components/node_modules/dom-helpers/esm/addClass.js.map +1 -0
- package/dist/components/node_modules/dom-helpers/esm/hasClass.js +2 -0
- package/dist/components/node_modules/dom-helpers/esm/hasClass.js.map +1 -0
- package/dist/components/node_modules/dom-helpers/esm/removeClass.js +2 -0
- package/dist/components/node_modules/dom-helpers/esm/removeClass.js.map +1 -0
- package/dist/components/node_modules/object-assign/index.js +7 -0
- package/dist/components/node_modules/object-assign/index.js.map +1 -0
- package/dist/components/node_modules/prop-types/checkPropTypes.js +2 -0
- package/dist/components/node_modules/prop-types/checkPropTypes.js.map +1 -0
- package/dist/components/node_modules/prop-types/factoryWithThrowingShims.js +2 -0
- package/dist/components/node_modules/prop-types/factoryWithThrowingShims.js.map +1 -0
- package/dist/components/node_modules/prop-types/factoryWithTypeCheckers.js +2 -0
- package/dist/components/node_modules/prop-types/factoryWithTypeCheckers.js.map +1 -0
- package/dist/components/node_modules/prop-types/index.js +2 -0
- package/dist/components/node_modules/prop-types/index.js.map +1 -0
- package/dist/components/node_modules/prop-types/lib/ReactPropTypesSecret.js +2 -0
- package/dist/components/node_modules/prop-types/lib/ReactPropTypesSecret.js.map +1 -0
- package/dist/components/node_modules/prop-types/lib/has.js +2 -0
- package/dist/components/node_modules/prop-types/lib/has.js.map +1 -0
- package/dist/components/node_modules/react-is/cjs/react-is.development.js +2 -0
- package/dist/components/node_modules/react-is/cjs/react-is.development.js.map +1 -0
- package/dist/components/node_modules/react-is/cjs/react-is.production.min.js +10 -0
- package/dist/components/node_modules/react-is/cjs/react-is.production.min.js.map +1 -0
- package/dist/components/node_modules/react-is/index.js +2 -0
- package/dist/components/node_modules/react-is/index.js.map +1 -0
- package/dist/components/node_modules/react-transition-group/esm/CSSTransition.js +2 -0
- package/dist/components/node_modules/react-transition-group/esm/CSSTransition.js.map +1 -0
- package/dist/components/node_modules/react-transition-group/esm/Transition.js +2 -0
- package/dist/components/node_modules/react-transition-group/esm/Transition.js.map +1 -0
- package/dist/components/node_modules/react-transition-group/esm/TransitionGroupContext.js +2 -0
- package/dist/components/node_modules/react-transition-group/esm/TransitionGroupContext.js.map +1 -0
- package/dist/components/node_modules/react-transition-group/esm/config.js +2 -0
- package/dist/components/node_modules/react-transition-group/esm/config.js.map +1 -0
- package/dist/components/node_modules/react-transition-group/esm/utils/PropTypes.js +2 -0
- package/dist/components/node_modules/react-transition-group/esm/utils/PropTypes.js.map +1 -0
- package/dist/components/node_modules/tslib/tslib.es6.js +2 -0
- package/dist/components/node_modules/tslib/tslib.es6.js.map +1 -0
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/index.umd.js +2 -2
- package/dist/index.umd.js.map +1 -1
- package/dist/styles/components/forminput.scss +1 -0
- package/lib/components/FormInput/index.js +4 -6
- package/lib/components/FormInput/index.js.map +1 -1
- package/lib/components/Image/index.js +7 -9
- package/lib/components/Image/index.js.map +1 -1
- package/package.json +1 -1
- package/readme.md +44 -5
- package/types/components/FormInput/index.d.ts +30 -6
|
@@ -10,14 +10,12 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
12
|
import React, { useRef, useImperativeHandle, forwardRef, } from "react";
|
|
13
|
-
import { Input, View, Text } from "@tarojs/components";
|
|
14
|
-
import { getEnv } from "@tarojs/taro";
|
|
13
|
+
import { Input, View, Text, } from "@tarojs/components";
|
|
15
14
|
import classNames from "classnames";
|
|
16
15
|
import { inputRange } from "../../utils/index";
|
|
17
16
|
import "./index.scss";
|
|
18
17
|
const FormInput = forwardRef((props, formRef) => {
|
|
19
|
-
const
|
|
20
|
-
const { onChange, maxlength, value, type, placeholder, label, labelHtml, RightComponent, onBlur, pattern, LeftComponent, LeftIcon, name, readonly = false, withArrow = false, password, direction = "row", border = true, mainExtra, padding = false } = props, rest = __rest(props, ["onChange", "maxlength", "value", "type", "placeholder", "label", "labelHtml", "RightComponent", "onBlur", "pattern", "LeftComponent", "LeftIcon", "name", "readonly", "withArrow", "password", "direction", "border", "mainExtra", "padding"]);
|
|
18
|
+
const { onChange, maxlength, value, type, placeholder, label, labelHtml, RightComponent, onBlur, pattern, LeftComponent, LeftIcon, name, readonly = false, withArrow = false, direction = "row", border = true, mainExtra, padding = false } = props, rest = __rest(props, ["onChange", "maxlength", "value", "type", "placeholder", "label", "labelHtml", "RightComponent", "onBlur", "pattern", "LeftComponent", "LeftIcon", "name", "readonly", "withArrow", "direction", "border", "mainExtra", "padding"]);
|
|
21
19
|
function handleChange(e) {
|
|
22
20
|
let inputValue = inputRange(e.target.value);
|
|
23
21
|
e.target.value = inputValue;
|
|
@@ -38,7 +36,7 @@ const FormInput = forwardRef((props, formRef) => {
|
|
|
38
36
|
border,
|
|
39
37
|
padding,
|
|
40
38
|
});
|
|
41
|
-
if (
|
|
39
|
+
if (process.env.TARO_ENV !== "h5") {
|
|
42
40
|
return (React.createElement(View, { className: wrapperCls },
|
|
43
41
|
React.createElement(View, { className: "xh-form-input-main" },
|
|
44
42
|
React.createElement(View, { className: "xh-form-input-main-left" },
|
|
@@ -49,7 +47,7 @@ const FormInput = forwardRef((props, formRef) => {
|
|
|
49
47
|
React.createElement(View, null, LeftComponent)),
|
|
50
48
|
React.createElement(View, { className: "xh-form-input-main-center" }, readonly ? (React.createElement(Text, { className: classNames("xh-form-input-readonly", {
|
|
51
49
|
"xh-form-input-placeholder": !value,
|
|
52
|
-
}) }, value || placeholder)) : (React.createElement(Input, Object.assign({}, rest, { ref: inputRef, className: "xh-form-input-main-center-native", maxlength: maxlength, name: name, placeholder: placeholder, type: type, value: value, onBlur: handleBlur, onInput: handleChange
|
|
50
|
+
}) }, value || placeholder)) : (React.createElement(Input, Object.assign({}, rest, { ref: inputRef, className: "xh-form-input-main-center-native", maxlength: maxlength, name: name, placeholder: placeholder, type: type, value: value, onBlur: handleBlur, onInput: handleChange })))),
|
|
53
51
|
mainExtra && (React.createElement(View, { className: "xh-form-input-main-extra" }, mainExtra))),
|
|
54
52
|
React.createElement(View, { className: "xh-form-input-right" },
|
|
55
53
|
RightComponent,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FormInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAEZ,MAAM,EACN,mBAAmB,EACnB,UAAU,GACX,MAAM,OAAO,CAAC;AACf,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FormInput/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,17 +1,15 @@
|
|
|
1
1
|
import React, { useEffect, useMemo, useState } from "react";
|
|
2
2
|
import { Image } from "@tarojs/components";
|
|
3
|
-
import { getImageInfo
|
|
3
|
+
import { getImageInfo } from "@tarojs/taro";
|
|
4
4
|
import "./index.scss";
|
|
5
|
-
|
|
6
|
-
const XHImage = (props) => {
|
|
5
|
+
const XHImage = props => {
|
|
7
6
|
const { width = "", height = "", src, className } = props;
|
|
8
7
|
const [defaultSize, setDefaultSize] = useState({});
|
|
9
|
-
const state = useTaroEnv();
|
|
10
8
|
useEffect(() => {
|
|
11
9
|
if (process.env.TARO_ENV !== "h5" && !className) {
|
|
12
10
|
getImageInfo({
|
|
13
11
|
src,
|
|
14
|
-
success:
|
|
12
|
+
success: res => {
|
|
15
13
|
if (res.errMsg === "getImageInfo:ok") {
|
|
16
14
|
console.log(res);
|
|
17
15
|
setDefaultSize({ width: res.width, height: res.height });
|
|
@@ -21,19 +19,19 @@ const XHImage = (props) => {
|
|
|
21
19
|
}
|
|
22
20
|
else {
|
|
23
21
|
}
|
|
24
|
-
}, [
|
|
22
|
+
}, []);
|
|
25
23
|
const size = useMemo(() => {
|
|
26
24
|
let computedSize = defaultSize || {};
|
|
27
25
|
if (width) {
|
|
28
|
-
computedSize.width = `${
|
|
26
|
+
computedSize.width = `${width}`;
|
|
29
27
|
}
|
|
30
28
|
if (height) {
|
|
31
|
-
computedSize.height = `${
|
|
29
|
+
computedSize.height = `${height}`;
|
|
32
30
|
}
|
|
33
31
|
console.log("size");
|
|
34
32
|
return computedSize;
|
|
35
33
|
}, [width, height, defaultSize]);
|
|
36
|
-
return
|
|
34
|
+
return process.env.TARO_ENV !== "h5" ? (React.createElement(Image, { src: src, style: size, className: className })) : (React.createElement("img", { src: src, alt: "", style: size, className: className }));
|
|
37
35
|
};
|
|
38
36
|
export default XHImage;
|
|
39
37
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Image/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Image/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,cAAc,CAAC;AAStB,MAAM,OAAO,GAAmB,KAAK,CAAC,EAAE;IACtC,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC1D,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAGpC,EAAE,CAAC,CAAC;IAEd,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,IAAI,IAAI,CAAC,SAAS,EAAE;YAC/C,YAAY,CAAC;gBACX,GAAG;gBACH,OAAO,EAAE,GAAG,CAAC,EAAE;oBACb,IAAI,GAAG,CAAC,MAAM,KAAK,iBAAiB,EAAE;wBACpC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;wBACjB,cAAc,CAAC,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,CAAC,CAAC;qBAC1D;gBACH,CAAC;aACF,CAAC,CAAC;SACJ;aAAM;SACN;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,EAAE;QACxB,IAAI,YAAY,GAAG,WAAW,IAAI,EAAE,CAAC;QACrC,IAAI,KAAK,EAAE;YACR,YAAoB,CAAC,KAAK,GAAG,GAAG,KAAK,EAAE,CAAC;SAC1C;QACD,IAAI,MAAM,EAAE;YACT,YAAoB,CAAC,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;SAC5C;QACD,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;QAEpB,OAAO,YAAY,CAAC;IACtB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC;IAEjC,OAAO,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CACrC,oBAAC,KAAK,IAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,GAAI,CACvD,CAAC,CAAC,CAAC,CACF,6BAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAC,EAAE,EAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,GAAI,CAC5D,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -1,19 +1,23 @@
|
|
|
1
|
-
# 基于taro的多端UI组件库
|
|
1
|
+
# 基于 taro 的多端 UI 组件库
|
|
2
2
|
|
|
3
3
|
## 特性
|
|
4
|
-
|
|
4
|
+
|
|
5
|
+
- 目前只支持 h5 以及微信小程序,暂不支持其他端
|
|
5
6
|
|
|
6
7
|
## 使用
|
|
8
|
+
|
|
7
9
|
```bash
|
|
8
|
-
yarn add taro-uilib
|
|
10
|
+
yarn add taro-react-uilib
|
|
9
11
|
```
|
|
10
12
|
|
|
11
13
|
```bash
|
|
12
|
-
npm install taro-uilib
|
|
14
|
+
npm install taro-react-uilib
|
|
13
15
|
```
|
|
14
16
|
|
|
15
17
|
## 配置
|
|
18
|
+
|
|
16
19
|
`config/index.js`
|
|
20
|
+
|
|
17
21
|
```js
|
|
18
22
|
const config = {
|
|
19
23
|
// 其他配置
|
|
@@ -22,4 +26,39 @@ const config = {
|
|
|
22
26
|
// 其他配置
|
|
23
27
|
...
|
|
24
28
|
}
|
|
25
|
-
```
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## 按需加载
|
|
32
|
+
|
|
33
|
+
### 首先引入 babel-plugin-import
|
|
34
|
+
|
|
35
|
+
```bash
|
|
36
|
+
yarn add babel-plugin-import -D
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
### 配置 babel-plugin-import 在 babel-config.js 里
|
|
40
|
+
|
|
41
|
+
```js
|
|
42
|
+
{
|
|
43
|
+
plugins: [
|
|
44
|
+
[
|
|
45
|
+
'import',
|
|
46
|
+
{
|
|
47
|
+
libraryName: 'taro-react-uilib',
|
|
48
|
+
customName: name => {
|
|
49
|
+
const finalName = name.replace(/XH/, '')
|
|
50
|
+
return `taro-react-uilib/dist/components/${finalName}`
|
|
51
|
+
},
|
|
52
|
+
camel2DashComponentName: false,
|
|
53
|
+
style: name => {
|
|
54
|
+
const componentsName = name.split('/').pop().toLocaleLowerCase()
|
|
55
|
+
return `taro-react-uilib/dist/styles/components/${componentsName}.scss`
|
|
56
|
+
}
|
|
57
|
+
},
|
|
58
|
+
'taro-react-uilib'
|
|
59
|
+
]
|
|
60
|
+
// others....
|
|
61
|
+
...
|
|
62
|
+
]
|
|
63
|
+
}
|
|
64
|
+
```
|
|
@@ -1,14 +1,27 @@
|
|
|
1
1
|
import React, { ReactNode } from "react";
|
|
2
|
-
import { InputProps } from "@tarojs/components";
|
|
2
|
+
import { InputProps, CommonEventFunction } from "@tarojs/components";
|
|
3
3
|
import "./index.scss";
|
|
4
|
-
export declare type HTMLFormType = "tel" | "text" | "number" | "password";
|
|
4
|
+
export declare type HTMLFormType = "tel" | "text" | "number" | "password" | "idcard" | "digit" | "safe-password" | "nickname";
|
|
5
5
|
export declare type FormInputProps = {
|
|
6
6
|
onChange?: (value: string) => void;
|
|
7
7
|
onBlur?: (value: string) => void;
|
|
8
|
-
value
|
|
8
|
+
/** 当键盘输入时,触发input事件,event.detail = {value, cursor, keyCode},处理函数可以直接 return 一个字符串,将替换输入框的内容。
|
|
9
|
+
* @supported weapp, h5, rn
|
|
10
|
+
*/
|
|
11
|
+
onInput?: CommonEventFunction<InputProps.inputEventDetail>;
|
|
12
|
+
/** 输入框聚焦时触发,event.detail = { value, height },height 为键盘高度
|
|
13
|
+
* @supported weapp, h5, rn
|
|
14
|
+
*/
|
|
15
|
+
onFocus?: CommonEventFunction<InputProps.inputForceEventDetail>;
|
|
16
|
+
/** 输入框失去焦点时触发
|
|
17
|
+
*
|
|
18
|
+
* event.detail = {value: value}
|
|
19
|
+
* @supported weapp, h5, rn
|
|
20
|
+
*/
|
|
21
|
+
value?: string;
|
|
9
22
|
maxlength?: number;
|
|
10
23
|
placeholder?: string;
|
|
11
|
-
type?: HTMLFormType
|
|
24
|
+
type?: HTMLFormType;
|
|
12
25
|
pattern?: string;
|
|
13
26
|
RightComponent?: ReactNode;
|
|
14
27
|
label?: string;
|
|
@@ -22,9 +35,20 @@ export declare type FormInputProps = {
|
|
|
22
35
|
border?: boolean;
|
|
23
36
|
mainExtra?: ReactNode;
|
|
24
37
|
padding?: boolean;
|
|
25
|
-
|
|
38
|
+
password?: boolean;
|
|
39
|
+
focus?: boolean;
|
|
40
|
+
/** 设置键盘右下角按钮的文字
|
|
41
|
+
* @default done
|
|
42
|
+
* @supported weapp, rn
|
|
43
|
+
*/
|
|
44
|
+
confirmType?: "send" | "search" | "next" | "go" | "done";
|
|
45
|
+
/** 用于透传 `WebComponents` 上的属性到内部 H5 标签上
|
|
46
|
+
* @supported h5
|
|
47
|
+
*/
|
|
48
|
+
nativeProps?: Record<string, unknown>;
|
|
49
|
+
};
|
|
26
50
|
export declare type FocusHandler = {
|
|
27
51
|
focus: () => void;
|
|
28
52
|
};
|
|
29
|
-
declare const FormInput: React.ForwardRefExoticComponent<
|
|
53
|
+
declare const FormInput: React.ForwardRefExoticComponent<FormInputProps & React.RefAttributes<FocusHandler>>;
|
|
30
54
|
export default FormInput;
|