taro-react-uilib 1.0.2 → 1.0.4
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/index.esm.js +2599 -41
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +2604 -39
- package/dist/index.js.map +1 -1
- package/dist/index.umd.js +2606 -42
- package/dist/index.umd.js.map +1 -1
- package/dist/styles/components/alert.scss +4 -0
- package/dist/styles/components/bankicon.scss +4 -0
- package/dist/styles/components/button.scss +4 -6
- package/dist/styles/components/captcha.scss +2 -3
- package/dist/styles/components/confirm.scss +11 -0
- package/dist/styles/components/dialogcomponent.scss +191 -0
- package/dist/styles/components/dialogref.scss +214 -0
- package/dist/styles/components/{formInput.scss → forminput.scss} +8 -8
- package/dist/styles/components/index.scss +13 -4
- package/dist/styles/components/key.scss +27 -0
- package/dist/styles/components/loading.scss +1 -4
- package/dist/styles/components/mask.scss +2 -2
- package/dist/styles/components/numberkeyboard.scss +72 -0
- package/dist/styles/components/page.scss +17 -1
- package/dist/styles/components/passwordinput.scss +42 -0
- package/dist/styles/components/progress.scss +30 -0
- package/dist/styles/components/toast.scss +83 -0
- package/dist/styles/themes/base.scss +1 -1
- package/dist/styles/themes/default.scss +6 -0
- package/dist/styles/themes/variable.scss +25 -0
- package/lib/components/BankIcon/index.js +7 -7
- package/lib/components/BankIcon/index.js.map +1 -1
- package/lib/components/Button/index.js +22 -22
- package/lib/components/Button/index.js.map +1 -1
- package/lib/components/Dialog/Alert/index.js +16 -15
- package/lib/components/Dialog/Alert/index.js.map +1 -1
- package/lib/components/Dialog/Confirm/index.js +43 -0
- package/lib/components/Dialog/Confirm/index.js.map +1 -0
- package/lib/components/Dialog/{Dialog → DialogComponent}/index.js +10 -10
- package/lib/components/Dialog/DialogComponent/index.js.map +1 -0
- package/lib/components/Dialog/index.js +3 -1
- package/lib/components/Dialog/index.js.map +1 -1
- package/lib/components/DialogRef/index.js +55 -0
- package/lib/components/DialogRef/index.js.map +1 -0
- package/lib/components/FormInput/index.js +16 -16
- package/lib/components/FormInput/index.js.map +1 -1
- package/lib/components/Image/index.js +12 -6
- package/lib/components/Image/index.js.map +1 -1
- package/lib/components/NumberKeyboard/Key/index.js +9 -0
- package/lib/components/NumberKeyboard/Key/index.js.map +1 -0
- package/lib/components/NumberKeyboard/index.js +56 -0
- package/lib/components/NumberKeyboard/index.js.map +1 -0
- package/lib/components/PasswordInput/index.js +24 -0
- package/lib/components/PasswordInput/index.js.map +1 -0
- package/lib/components/Progress/index.js +20 -0
- package/lib/components/Progress/index.js.map +1 -0
- package/lib/components/Toast/Toast.js +37 -0
- package/lib/components/Toast/Toast.js.map +1 -0
- package/lib/components/Toast/index.js +48 -0
- package/lib/components/Toast/index.js.map +1 -0
- package/lib/index.js +15 -9
- package/lib/index.js.map +1 -1
- package/package.json +3 -2
- package/types/components/BankIcon/index.d.ts +5 -5
- package/types/components/Button/index.d.ts +17 -17
- package/types/components/Dialog/Alert/index.d.ts +18 -2
- package/types/components/Dialog/Confirm/index.d.ts +37 -0
- package/types/components/Dialog/DialogComponent/index.d.ts +19 -0
- package/types/components/Dialog/index.d.ts +3 -1
- package/types/components/DialogRef/index.d.ts +30 -0
- package/types/components/NumberKeyboard/Key/index.d.ts +8 -0
- package/types/components/NumberKeyboard/index.d.ts +23 -0
- package/types/components/PasswordInput/index.d.ts +11 -0
- package/types/components/Progress/index.d.ts +12 -0
- package/types/components/Toast/Toast.d.ts +20 -0
- package/types/components/Toast/index.d.ts +5 -0
- package/types/index.d.ts +15 -9
- package/dist/styles/components/backIcon.scss +0 -10
- package/dist/styles/components/images/loading.png +0 -0
- package/lib/components/Dialog/Dialog/index.js.map +0 -1
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
|
|
2
|
+
|
|
3
|
+
#{$xh-prefix}-progress {
|
|
4
|
+
width: 100%;
|
|
5
|
+
.progress {
|
|
6
|
+
height: 20px;
|
|
7
|
+
width: 100%;
|
|
8
|
+
position: relative;
|
|
9
|
+
border-radius: 8px;
|
|
10
|
+
background-color: #f0f0f0;
|
|
11
|
+
&-bar{
|
|
12
|
+
position: absolute;
|
|
13
|
+
background-color: #f6ab01;
|
|
14
|
+
width: 50%;
|
|
15
|
+
height: 100%;
|
|
16
|
+
border-radius: 8px;
|
|
17
|
+
transition: width .6s;
|
|
18
|
+
&-percent {
|
|
19
|
+
display: block;
|
|
20
|
+
content: attr(data-progress) "%";
|
|
21
|
+
position: absolute;
|
|
22
|
+
right: 3px;
|
|
23
|
+
top: 50%;
|
|
24
|
+
transform: translateY(-50%);
|
|
25
|
+
font-size: 22px;
|
|
26
|
+
line-height: 100%;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
@import '../../styles/themes/variable.scss';
|
|
2
|
+
@import '../../styles/themes/default.scss';
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
@font-face {
|
|
6
|
+
font-family: 'iconfont';
|
|
7
|
+
src: url('./font/iconfont.ttf?t=1656570936378') format('woff2'),
|
|
8
|
+
url('../../assets/font/iconfont.woff?t=1656570936378') format('woff'),
|
|
9
|
+
url('../../assets/font/iconfont.woff2?t=1656570936378') format('truetype');
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.iconfont {
|
|
13
|
+
font-family: "iconfont" !important;
|
|
14
|
+
font-size: 32PX;
|
|
15
|
+
font-style: normal;
|
|
16
|
+
-webkit-font-smoothing: antialiased;
|
|
17
|
+
-moz-osx-font-smoothing: grayscale;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.icon-alert_toast:before {
|
|
21
|
+
content: "\e632";
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.icon-failure_toast:before {
|
|
25
|
+
content: "\e636";
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.icon-success_toast:before {
|
|
29
|
+
content: "\e63a";
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
@keyframes rotate {
|
|
33
|
+
from {
|
|
34
|
+
transform: rotate(0deg)
|
|
35
|
+
}
|
|
36
|
+
to {
|
|
37
|
+
transform: rotate(180deg)
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.icon-loading_toast {
|
|
42
|
+
animation: rotate 3s linear infinite;
|
|
43
|
+
}
|
|
44
|
+
.icon-loading_toast:before {
|
|
45
|
+
content: "\e676";
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
#{$xh-prefix}-toast {
|
|
51
|
+
position: fixed;
|
|
52
|
+
top: 0;
|
|
53
|
+
left: 0;
|
|
54
|
+
right: 0;
|
|
55
|
+
bottom: 0;
|
|
56
|
+
display: flex;
|
|
57
|
+
align-items: center;
|
|
58
|
+
justify-content: center;
|
|
59
|
+
font-size: 14PX;
|
|
60
|
+
&-content {
|
|
61
|
+
position: absolute;
|
|
62
|
+
z-index: 998;
|
|
63
|
+
min-width: 250px;
|
|
64
|
+
box-sizing: border-box;
|
|
65
|
+
border-radius: 10px;
|
|
66
|
+
text-align: center;
|
|
67
|
+
padding: 24px 0;
|
|
68
|
+
background-color: var(--toast-bg-color);
|
|
69
|
+
color: var(--dialog-color);
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
.xh-confirm-footer {
|
|
75
|
+
display: flex;
|
|
76
|
+
justify-content: space-between;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.alert-button {
|
|
80
|
+
width: 44%;
|
|
81
|
+
height: 80px;
|
|
82
|
+
line-height: 1;
|
|
83
|
+
}
|
|
@@ -22,4 +22,10 @@ $btn-shadow-primary: 0 10px 20px rgba(247, 174, 5, 0.3);
|
|
|
22
22
|
|
|
23
23
|
$mask-color: rgba(0, 0, 0, 0.3);
|
|
24
24
|
|
|
25
|
+
$toast-bg-light: #4c4c4c;
|
|
26
|
+
$toast-bg-dark: #4c4c4c;
|
|
27
|
+
|
|
28
|
+
$dialog-color-dark: #FFF;
|
|
29
|
+
$dialog-color-light: rgba(255,255,255,0.9);
|
|
30
|
+
|
|
25
31
|
$border-radius: 10px;
|
|
@@ -17,4 +17,29 @@ $xh-prefix: '.xh';
|
|
|
17
17
|
--btn-color: #{$btn-color};
|
|
18
18
|
--btn-shadow-primary: #{$btn-shadow-primary};
|
|
19
19
|
--mask-color: #{$mask-color};
|
|
20
|
+
--toast-bg-color: #{$toast-bg-light};
|
|
21
|
+
--dialog-color: #{$dialog-color-light};
|
|
20
22
|
}
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
@media (prefers-color-scheme: dark) {
|
|
26
|
+
:root {
|
|
27
|
+
--color-primary: #{$color-primary};
|
|
28
|
+
--color-primary-dark: #{$color-primary-dark};
|
|
29
|
+
--color-primary-reverse: #{$color-primary-reverse};
|
|
30
|
+
--color-disabled: #{$color-disabled};
|
|
31
|
+
--color-warning: #{$color-warning};
|
|
32
|
+
--color-warning-light: #{$color-warning-light};
|
|
33
|
+
--background-color: #{$background-color};
|
|
34
|
+
--body-background-color: #{$body-background-color};
|
|
35
|
+
--font-color: #{$font-color};
|
|
36
|
+
--font-color-secondary: #{$font-color-secondary};
|
|
37
|
+
--font-color-tertiary: #{$font-color-tertiary};
|
|
38
|
+
--border-color: #{$border-color};
|
|
39
|
+
--btn-color: #{$btn-color};
|
|
40
|
+
--btn-shadow-primary: #{$btn-shadow-primary};
|
|
41
|
+
--mask-color: #{$mask-color};
|
|
42
|
+
--toast-bg-color: #{$toast-bg-dark};
|
|
43
|
+
--dialog-color: #{$dialog-color-dark};
|
|
44
|
+
}
|
|
45
|
+
}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import React from
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import React from "react";
|
|
2
|
+
import classNames from "classnames";
|
|
3
|
+
import Image from "../../../src/components/Image";
|
|
4
|
+
import bankImage from "./bank";
|
|
5
|
+
import "./index.scss";
|
|
6
6
|
const XHBankIcon = (props) => {
|
|
7
7
|
const { code, className, size } = props;
|
|
8
|
-
const cls = classNames(
|
|
9
|
-
return (React.createElement(Image, { src: bankImage[code], className: cls }));
|
|
8
|
+
const cls = classNames("xh-bank-icon", className);
|
|
9
|
+
return (React.createElement(Image, { src: bankImage[code], width: size, height: size, className: cls }));
|
|
10
10
|
};
|
|
11
11
|
export default XHBankIcon;
|
|
12
12
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/BankIcon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/BankIcon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,KAAK,MAAM,+BAA+B,CAAC;AAClD,OAAO,SAAS,MAAM,QAAQ,CAAC;AAE/B,OAAO,cAAc,CAAC;AAQtB,MAAM,UAAU,GAAoB,CAAC,KAAK,EAAE,EAAE;IAC5C,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAExC,MAAM,GAAG,GAAG,UAAU,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;IAElD,OAAO,CACL,oBAAC,KAAK,IAAC,GAAG,EAAE,SAAS,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,GAAI,CAC3E,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,UAAU,CAAC"}
|
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import React from
|
|
2
|
-
import classNames from
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
const XhButton = props => {
|
|
7
|
-
const { disabled = false, type =
|
|
1
|
+
import React from "react";
|
|
2
|
+
import classNames from "classnames";
|
|
3
|
+
import { Button } from "@tarojs/components";
|
|
4
|
+
import { useTaroEnv } from "../../hooks";
|
|
5
|
+
import "./index.scss";
|
|
6
|
+
const XhButton = (props) => {
|
|
7
|
+
const { disabled = false, type = "default", size = "normal", shape = "round", children, className, htmlType, formType, text, openType, lang, sessionFrom, sendMessageTitle, sendMessagePath, sendMessageImg, showMessageCard, appParameter, onGetUserInfo, onGetPhoneNumber, onOpenSetting, onError, onContact, onClick, } = props;
|
|
8
8
|
const state = useTaroEnv();
|
|
9
|
-
const classObj = classNames(
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
9
|
+
const classObj = classNames("xh-button", {
|
|
10
|
+
"xh-button-default": type === "default",
|
|
11
|
+
"xh-button-primary": type === "primary",
|
|
12
|
+
"xh-button-secondary": type === "secondary",
|
|
13
|
+
"xh-button-warn": type === "warn",
|
|
14
|
+
"xh-button-square": shape === "square",
|
|
15
|
+
"xh-button-round": shape === "round",
|
|
16
|
+
"xh-button-normal": size === "normal",
|
|
17
|
+
"xh-button-small": size === "mini",
|
|
18
|
+
"xh-button-full": size === "full",
|
|
19
|
+
"xh-button-disabled": disabled,
|
|
20
|
+
"xh-button-webutton": state === "WEAPP",
|
|
21
21
|
}, className);
|
|
22
|
-
const handleClick = e => {
|
|
23
|
-
state ===
|
|
22
|
+
const handleClick = (e) => {
|
|
23
|
+
state === "WEB" && e.nativeEvent.stopImmediatePropagation();
|
|
24
24
|
e.preventDefault();
|
|
25
25
|
onClick && onClick(e);
|
|
26
26
|
};
|
|
27
27
|
const weButton = (React.createElement(Button, { className: classObj, formType: formType, openType: openType, lang: lang, type: type, sessionFrom: sessionFrom, sendMessageTitle: sendMessageTitle, sendMessagePath: sendMessagePath, sendMessageImg: sendMessageImg, showMessageCard: showMessageCard, appParameter: appParameter, onGetUserInfo: onGetUserInfo, onGetPhoneNumber: onGetPhoneNumber, onOpenSetting: onOpenSetting, onError: onError, onContact: onContact, onClick: onClick, disabled: disabled }, children));
|
|
28
|
-
if (state ===
|
|
28
|
+
if (state === "WEAPP") {
|
|
29
29
|
return weButton;
|
|
30
30
|
}
|
|
31
31
|
return (
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AACrD,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAO5C,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,cAAc,CAAC;AA0CtB,MAAM,QAAQ,GAAsB,CAAC,KAAK,EAAE,EAAE;IAC5C,MAAM,EACJ,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,QAAQ,EACf,KAAK,GAAG,OAAO,EACf,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,eAAe,EACf,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,aAAa,EACb,OAAO,EACP,SAAS,EACT,OAAO,GACR,GAAG,KAAK,CAAC;IACV,MAAM,KAAK,GAAG,UAAU,EAAE,CAAC;IAE3B,MAAM,QAAQ,GAAG,UAAU,CACzB,WAAW,EACX;QACE,mBAAmB,EAAE,IAAI,KAAK,SAAS;QACvC,mBAAmB,EAAE,IAAI,KAAK,SAAS;QACvC,qBAAqB,EAAE,IAAI,KAAK,WAAW;QAC3C,gBAAgB,EAAE,IAAI,KAAK,MAAM;QACjC,kBAAkB,EAAE,KAAK,KAAK,QAAQ;QACtC,iBAAiB,EAAE,KAAK,KAAK,OAAO;QACpC,kBAAkB,EAAE,IAAI,KAAK,QAAQ;QACrC,iBAAiB,EAAE,IAAI,KAAK,MAAM;QAClC,gBAAgB,EAAE,IAAI,KAAK,MAAM;QACjC,oBAAoB,EAAE,QAAQ;QAC9B,oBAAoB,EAAE,KAAK,KAAK,OAAO;KACxC,EACD,SAAS,CACV,CAAC;IAEF,MAAM,WAAW,GAA2C,CAAC,CAAC,EAAE,EAAE;QAChE,KAAK,KAAK,KAAK,IAAI,CAAC,CAAC,WAAW,CAAC,wBAAwB,EAAE,CAAC;QAC5D,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,OAAO,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,CACf,oBAAC,MAAM,IACL,SAAS,EAAE,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAA2B,EACjC,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,gBAAgB,EAClC,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,IAEjB,QAAQ,CACF,CACV,CAAC;IAEF,IAAI,KAAK,KAAK,OAAO,EAAE;QACrB,OAAO,QAAQ,CAAC;KACjB;IAED,OAAO;IACL,iDAAiD;IACjD,gCACE,SAAS,EAAE,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,QAAQ,EACd,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,IAE1C,QAAQ,IAAI,IAAI,CACV,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -1,33 +1,34 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
1
12
|
import React, { createRef } from "react";
|
|
2
13
|
import ReactDOM from "react-dom";
|
|
3
14
|
import { showModal } from "@tarojs/taro";
|
|
4
|
-
import Dialog from "../
|
|
15
|
+
import Dialog from "../DialogComponent";
|
|
5
16
|
import Button from "../../../../src/components/Button";
|
|
6
17
|
import "./index.scss";
|
|
7
18
|
const Alert = (props) => {
|
|
8
|
-
const { title = "
|
|
19
|
+
const { title = "", content, confirmText = "我知道了" } = props, rest = __rest(props, ["title", "content", "confirmText"]);
|
|
9
20
|
return new Promise((resolve) => {
|
|
10
21
|
if (process.env.TARO_ENV === "h5") {
|
|
11
22
|
const div = document.createElement("div");
|
|
12
|
-
document.body.appendChild(div);
|
|
13
23
|
const dialogRef = createRef();
|
|
14
|
-
const alertFooter = (React.createElement(Button, { type: "primary", className: "alert-button", onClick: () => {
|
|
15
|
-
var _a;
|
|
16
|
-
(_a = dialogRef.current) === null || _a === void 0 ? void 0 : _a.close();
|
|
24
|
+
const alertFooter = (React.createElement(Button, { type: "primary", className: "xh-alert-button", onClick: () => {
|
|
17
25
|
ReactDOM.unmountComponentAtNode(div);
|
|
18
|
-
document.body.removeChild(div);
|
|
19
26
|
resolve();
|
|
20
|
-
} },
|
|
27
|
+
} }, confirmText));
|
|
21
28
|
ReactDOM.render(React.createElement(Dialog, { header: title, footer: alertFooter, content: content, visible: true, ref: dialogRef }), div);
|
|
22
29
|
}
|
|
23
30
|
else {
|
|
24
|
-
showModal({
|
|
25
|
-
title: title,
|
|
26
|
-
content: content,
|
|
27
|
-
showCancel: false,
|
|
28
|
-
confirmColor: "#f6ab00",
|
|
29
|
-
confirmText: buttonText,
|
|
30
|
-
}).then(() => resolve());
|
|
31
|
+
showModal(Object.assign({ title: title, content: content, showCancel: false, confirmColor: "#f6ab00", confirmText: confirmText }, rest)).then(() => resolve());
|
|
31
32
|
}
|
|
32
33
|
});
|
|
33
34
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Dialog/Alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AACpD,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,MAAqB,MAAM,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Dialog/Alert/index.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AACpD,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,MAAqB,MAAM,oBAAoB,CAAC;AACvD,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,cAAc,CAAC;AAyBtB,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAiB,EAAE;IACjD,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,OAAO,EAAE,WAAW,GAAG,MAAM,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA9D,mCAAsD,CAAQ,CAAC;IACrE,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;QAC7B,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,IAAI,EAAE;YACjC,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAC1C,MAAM,SAAS,GAAG,SAAS,EAAa,CAAC;YACzC,MAAM,WAAW,GAAG,CAClB,oBAAC,MAAM,IACL,IAAI,EAAC,SAAS,EACd,SAAS,EAAC,iBAAiB,EAC3B,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,sBAAsB,CAAC,GAAG,CAAC,CAAC;oBACrC,OAAO,EAAE,CAAC;gBACZ,CAAC,IAEA,WAAW,CACL,CACV,CAAC;YACF,QAAQ,CAAC,MAAM,CACb,oBAAC,MAAM,IACL,MAAM,EAAE,KAAK,EACb,MAAM,EAAE,WAAW,EACnB,OAAO,EAAE,OAAO,EAChB,OAAO,QACP,GAAG,EAAE,SAAS,GACd,EACF,GAAG,CACJ,CAAC;SACH;aAAM;YACL,SAAS,iBACP,KAAK,EAAE,KAAe,EACtB,OAAO,EAAE,OAAiB,EAC1B,UAAU,EAAE,KAAK,EACjB,YAAY,EAAE,SAAS,EACvB,WAAW,EAAE,WAAqB,IAC/B,IAAI,EACP,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC;SAC1B;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import React, { createRef } from "react";
|
|
13
|
+
import ReactDOM from "react-dom";
|
|
14
|
+
import { showModal } from "@tarojs/taro";
|
|
15
|
+
import DialogComponent from "../DialogComponent";
|
|
16
|
+
import Button from "../../Button";
|
|
17
|
+
import "./index.scss";
|
|
18
|
+
const Comfirm = (props) => {
|
|
19
|
+
const { title = "", content, confirmText = "确定", cancelText = "取消" } = props, rest = __rest(props, ["title", "content", "confirmText", "cancelText"]);
|
|
20
|
+
return new Promise((resolve) => {
|
|
21
|
+
if (process.env.TARO_ENV === "h5") {
|
|
22
|
+
const div = document.createElement("div");
|
|
23
|
+
const dialogRef = createRef();
|
|
24
|
+
const alertFooter = (React.createElement("div", { className: "xh-confirm-footer" },
|
|
25
|
+
React.createElement(Button, { className: "alert-button", onClick: () => {
|
|
26
|
+
ReactDOM.unmountComponentAtNode(div);
|
|
27
|
+
resolve({ errMsg: "ok", confirm: false, cancel: true });
|
|
28
|
+
} }, cancelText),
|
|
29
|
+
React.createElement(Button, { type: "primary", className: "alert-button", onClick: () => {
|
|
30
|
+
ReactDOM.unmountComponentAtNode(div);
|
|
31
|
+
resolve({ errMsg: "ok", confirm: true, cancel: false });
|
|
32
|
+
} }, confirmText)));
|
|
33
|
+
ReactDOM.render(React.createElement(DialogComponent, { header: title, footer: alertFooter, content: content, visible: true, ref: dialogRef }), div);
|
|
34
|
+
}
|
|
35
|
+
else {
|
|
36
|
+
showModal(Object.assign({ title,
|
|
37
|
+
content, confirmColor: "#f6ab00", cancelText,
|
|
38
|
+
confirmText }, rest)).then(resolve);
|
|
39
|
+
}
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
export default Comfirm;
|
|
43
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Dialog/Confirm/index.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,eAA8B,MAAM,oBAAoB,CAAC;AAChE,OAAO,MAAM,MAAM,cAAc,CAAC;AAClC,OAAO,cAAc,CAAC;AAqCtB,MAAM,OAAO,GAAG,CAAC,KAAmB,EAA+B,EAAE;IACnE,MAAM,EACJ,KAAK,GAAG,EAAE,EACV,OAAO,EACP,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,IAAI,KAEf,KAAK,EADJ,IAAI,UACL,KAAK,EANH,iDAML,CAAQ,CAAC;IACV,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;QAC7B,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,IAAI,EAAE;YACjC,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAE1C,MAAM,SAAS,GAAG,SAAS,EAAa,CAAC;YACzC,MAAM,WAAW,GAAG,CAClB,6BAAK,SAAS,EAAC,mBAAmB;gBAChC,oBAAC,MAAM,IACL,SAAS,EAAC,cAAc,EACxB,OAAO,EAAE,GAAG,EAAE;wBACZ,QAAQ,CAAC,sBAAsB,CAAC,GAAG,CAAC,CAAC;wBACrC,OAAO,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;oBAC1D,CAAC,IAEA,UAAU,CACJ;gBACT,oBAAC,MAAM,IACL,IAAI,EAAC,SAAS,EACd,SAAS,EAAC,cAAc,EACxB,OAAO,EAAE,GAAG,EAAE;wBACZ,QAAQ,CAAC,sBAAsB,CAAC,GAAG,CAAC,CAAC;wBACrC,OAAO,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC;oBAC1D,CAAC,IAEA,WAAW,CACL,CACL,CACP,CAAC;YACF,QAAQ,CAAC,MAAM,CACb,oBAAC,eAAe,IACd,MAAM,EAAE,KAAK,EACb,MAAM,EAAE,WAAW,EACnB,OAAO,EAAE,OAAO,EAChB,OAAO,QACP,GAAG,EAAE,SAAS,GACd,EACF,GAAG,CACJ,CAAC;SACH;aAAM;YACL,SAAS,iBACP,KAAK;gBACL,OAAO,EACP,YAAY,EAAE,SAAS,EACvB,UAAU;gBACV,WAAW,IACR,IAAI,EACP,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SAClB;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
|
@@ -3,29 +3,29 @@ import ReactDOM from "react-dom";
|
|
|
3
3
|
import classNames from "classnames";
|
|
4
4
|
import { View } from "@tarojs/components";
|
|
5
5
|
import { CSSTransition } from "react-transition-group";
|
|
6
|
-
import Mask from "
|
|
6
|
+
import Mask from "../../Mask";
|
|
7
7
|
import "./index.scss";
|
|
8
|
-
const
|
|
8
|
+
const DialogCom = forwardRef((props, fromRef) => {
|
|
9
9
|
const { header, content, footer, className = "", visible } = props;
|
|
10
10
|
const [selfVisible, setSelfVisible] = useState(false);
|
|
11
11
|
useImperativeHandle(fromRef, () => ({
|
|
12
12
|
close: () => {
|
|
13
|
+
console.log("closes");
|
|
13
14
|
setSelfVisible(false);
|
|
14
15
|
},
|
|
15
16
|
}));
|
|
16
17
|
useEffect(() => {
|
|
17
|
-
console.log(visible);
|
|
18
18
|
setSelfVisible(visible);
|
|
19
19
|
}, [visible]);
|
|
20
20
|
const dialogcls = classNames("xh-dialog", className);
|
|
21
|
-
const DialogMain = (React.createElement(View,
|
|
21
|
+
const DialogMain = (React.createElement(View, { className: dialogcls },
|
|
22
22
|
React.createElement(Mask, null),
|
|
23
|
-
React.createElement(CSSTransition, { in: selfVisible,
|
|
24
|
-
React.createElement(View,
|
|
25
|
-
React.createElement(View, { className: "xh-dialog-header" }, header),
|
|
26
|
-
React.createElement(View, { className: "xh-dialog-content" }, content),
|
|
27
|
-
React.createElement(View, { className: "xh-dialog-footer" }, footer)))));
|
|
23
|
+
React.createElement(CSSTransition, { in: selfVisible, timeout: 200, classNames: "scale", unmountOnExit: true },
|
|
24
|
+
React.createElement(View, { className: "xh-dialog-content" },
|
|
25
|
+
React.createElement(View, { className: "xh-dialog-content-header" }, header),
|
|
26
|
+
React.createElement(View, { className: "xh-dialog-content-content" }, content),
|
|
27
|
+
React.createElement(View, { className: "xh-dialog-content-footer" }, footer)))));
|
|
28
28
|
return ReactDOM.createPortal(DialogMain, document.body);
|
|
29
29
|
});
|
|
30
|
-
export default
|
|
30
|
+
export default DialogCom;
|
|
31
31
|
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Dialog/DialogComponent/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEZ,QAAQ,EACR,mBAAmB,EACnB,UAAU,EACV,SAAS,GACV,MAAM,OAAO,CAAC;AACf,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAEvD,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,cAAc,CAAC;AAYtB,MAAM,SAAS,GAAG,UAAU,CAAyB,CAAC,KAAK,EAAE,OAAO,EAAE,EAAE;IACtE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,GAAG,EAAE,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IACnE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtD,mBAAmB,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC;QAClC,KAAK,EAAE,GAAG,EAAE;YACV,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;YACtB,cAAc,CAAC,KAAK,CAAC,CAAC;QACxB,CAAC;KACF,CAAC,CAAC,CAAC;IAEJ,SAAS,CAAC,GAAG,EAAE;QACb,cAAc,CAAC,OAAO,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,SAAS,GAAG,UAAU,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;IAErD,MAAM,UAAU,GAAG,CACjB,oBAAC,IAAI,IAAC,SAAS,EAAE,SAAS;QACxB,oBAAC,IAAI,OAAG;QACR,oBAAC,aAAa,IACZ,EAAE,EAAE,WAAW,EACf,OAAO,EAAE,GAAG,EACZ,UAAU,EAAC,OAAO,EAClB,aAAa;YAEb,oBAAC,IAAI,IAAC,SAAS,EAAC,mBAAmB;gBACjC,oBAAC,IAAI,IAAC,SAAS,EAAC,0BAA0B,IAAE,MAAM,CAAQ;gBAC1D,oBAAC,IAAI,IAAC,SAAS,EAAC,2BAA2B,IAAE,OAAO,CAAQ;gBAC5D,oBAAC,IAAI,IAAC,SAAS,EAAC,0BAA0B,IAAE,MAAM,CAAQ,CACrD,CACO,CACX,CACR,CAAC;IAEF,OAAO,QAAQ,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC1D,CAAC,CAAC,CAAC;AAEH,eAAe,SAAS,CAAC"}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
|
-
import DialogComponent from "./
|
|
1
|
+
import DialogComponent from "./DialogComponent";
|
|
2
2
|
import Alert from "./Alert";
|
|
3
|
+
import Confirm from "./Confirm";
|
|
3
4
|
const Dialog = DialogComponent;
|
|
4
5
|
Dialog.alert = Alert;
|
|
6
|
+
Dialog.confirm = Confirm;
|
|
5
7
|
export default Dialog;
|
|
6
8
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Dialog/index.tsx"],"names":[],"mappings":"AACA,OAAO,eAA2C,MAAM,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Dialog/index.tsx"],"names":[],"mappings":"AACA,OAAO,eAA2C,MAAM,mBAAmB,CAAC;AAC5E,OAAO,KAAqB,MAAM,SAAS,CAAC;AAC5C,OAAO,OAA6C,MAAM,WAAW,CAAC;AAQtE,MAAM,MAAM,GAAG,eAA+C,CAAC;AAC/D,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;AACrB,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;AAEzB,eAAe,MAAM,CAAC"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import React, { useState, useImperativeHandle, forwardRef, useEffect, } from "react";
|
|
2
|
+
import classNames from "classnames";
|
|
3
|
+
import { View } from "@tarojs/components";
|
|
4
|
+
import { CSSTransition } from "react-transition-group";
|
|
5
|
+
import Button from "../Button";
|
|
6
|
+
import Mask from "../Mask";
|
|
7
|
+
import "./index.scss";
|
|
8
|
+
const DialogCom = forwardRef((props, fromRef) => {
|
|
9
|
+
const { header, content, className = "", visible, showCancel = true, onComfirm, onCancel, onClose, } = props;
|
|
10
|
+
const [selfVisible, setSelfVisible] = useState(false);
|
|
11
|
+
useImperativeHandle(fromRef, () => ({
|
|
12
|
+
close,
|
|
13
|
+
open,
|
|
14
|
+
}));
|
|
15
|
+
const close = () => {
|
|
16
|
+
setSelfVisible(false);
|
|
17
|
+
};
|
|
18
|
+
const open = () => {
|
|
19
|
+
setSelfVisible(true);
|
|
20
|
+
};
|
|
21
|
+
const handleConfirm = () => {
|
|
22
|
+
onComfirm && onComfirm();
|
|
23
|
+
close();
|
|
24
|
+
};
|
|
25
|
+
const handleCancel = () => {
|
|
26
|
+
onCancel && onCancel();
|
|
27
|
+
close();
|
|
28
|
+
};
|
|
29
|
+
useEffect(() => {
|
|
30
|
+
if (!visible) {
|
|
31
|
+
onClose && onClose();
|
|
32
|
+
}
|
|
33
|
+
setSelfVisible(visible);
|
|
34
|
+
}, [visible]);
|
|
35
|
+
const dialogcls = classNames("xh-dialog-ref", className, {
|
|
36
|
+
show: selfVisible,
|
|
37
|
+
});
|
|
38
|
+
const comfirmCls = classNames({ "one-button": !showCancel });
|
|
39
|
+
const footercls = classNames("xh-dialog-ref-content-footer-button", {
|
|
40
|
+
"xh-dialog-ref-content-footer-button-center": !showCancel,
|
|
41
|
+
});
|
|
42
|
+
const dialogFooter = (React.createElement(View, { className: footercls },
|
|
43
|
+
showCancel && React.createElement(Button, { onClick: handleCancel }, "\u53D6\u6D88"),
|
|
44
|
+
React.createElement(Button, { type: "primary", className: comfirmCls, onClick: handleConfirm }, "\u786E\u5B9A")));
|
|
45
|
+
const DialogMain = (React.createElement(View, { className: dialogcls },
|
|
46
|
+
React.createElement(Mask, null),
|
|
47
|
+
React.createElement(CSSTransition, { in: selfVisible, timeout: 200, classNames: "scale" },
|
|
48
|
+
React.createElement(View, { className: "xh-dialog-ref-content" },
|
|
49
|
+
React.createElement(View, { className: "xh-dialog-ref-content-header" }, header),
|
|
50
|
+
React.createElement(View, { className: "xh-dialog-ref-content-content" }, content),
|
|
51
|
+
React.createElement(View, { className: "xh-dialog-ref-content-footer" }, dialogFooter)))));
|
|
52
|
+
return DialogMain;
|
|
53
|
+
});
|
|
54
|
+
export default DialogCom;
|
|
55
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/DialogRef/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -23,31 +23,31 @@ const FormInput = React.forwardRef((props, formRef) => {
|
|
|
23
23
|
},
|
|
24
24
|
}));
|
|
25
25
|
if (taroEnv !== "WEB") {
|
|
26
|
-
return (React.createElement(View, { className: "form-input" },
|
|
27
|
-
React.createElement(View, { className: "form-input-left" },
|
|
28
|
-
label && (React.createElement(View, { className: "form-input-left-label" },
|
|
26
|
+
return (React.createElement(View, { className: "xh-form-input" },
|
|
27
|
+
React.createElement(View, { className: "xh-form-input-left" },
|
|
28
|
+
label && (React.createElement(View, { className: "xh-form-input-left-label" },
|
|
29
29
|
label,
|
|
30
|
-
React.createElement(View, { className: "form-input-left-label-icon" }, LeftIcon))),
|
|
30
|
+
React.createElement(View, { className: "xh-form-input-left-label-icon" }, LeftIcon))),
|
|
31
31
|
labelHtml && (React.createElement("label", { dangerouslySetInnerHTML: { __html: labelHtml }, className: "label" })),
|
|
32
32
|
React.createElement(View, null, LeftComponent)),
|
|
33
|
-
React.createElement(View, { className: "form-input-center" }, readonly ? (React.createElement(Text, { className: classNames("form-input-readonly", {
|
|
34
|
-
"form-input-placeholder": !value,
|
|
35
|
-
}) }, value || placeholder)) : (React.createElement(Input, { ref: inputRef, className: "form-input-center-native", maxlength: maxlength, name: name, placeholder: placeholder, type: type, value: value, onBlur: handleBlur, onInput: handleChange, password: password }))),
|
|
36
|
-
React.createElement(View, { className: "form-input-right" },
|
|
33
|
+
React.createElement(View, { className: "xh-form-input-center" }, readonly ? (React.createElement(Text, { className: classNames("xh-form-input-readonly", {
|
|
34
|
+
"xh-form-input-placeholder": !value,
|
|
35
|
+
}) }, value || placeholder)) : (React.createElement(Input, { ref: inputRef, className: "xh-form-input-center-native", maxlength: maxlength, name: name, placeholder: placeholder, type: type, value: value, onBlur: handleBlur, onInput: handleChange, password: password }))),
|
|
36
|
+
React.createElement(View, { className: "xh-form-input-right" },
|
|
37
37
|
RightComponent,
|
|
38
38
|
withArrow && React.createElement(View, { className: "arrow" }))));
|
|
39
39
|
}
|
|
40
|
-
return (React.createElement("div", { className: "form-input" },
|
|
41
|
-
React.createElement("div", { className: "form-input-left" },
|
|
42
|
-
label && (React.createElement("label", { className: "form-input-left-label" },
|
|
40
|
+
return (React.createElement("div", { className: "xh-form-input" },
|
|
41
|
+
React.createElement("div", { className: "xh-form-input-left" },
|
|
42
|
+
label && (React.createElement("label", { className: "xh-form-input-left-label" },
|
|
43
43
|
label,
|
|
44
|
-
React.createElement(View, { className: "form-input-left-label-icon" }, LeftIcon))),
|
|
44
|
+
React.createElement(View, { className: "xh-form-input-left-label-icon" }, LeftIcon))),
|
|
45
45
|
labelHtml && (React.createElement("label", { dangerouslySetInnerHTML: { __html: labelHtml }, className: "label" })),
|
|
46
46
|
React.createElement("div", null, LeftComponent)),
|
|
47
|
-
React.createElement("div", { className: "form-input-center" }, readonly ? (React.createElement("p", { className: classNames("form-input-readonly", {
|
|
48
|
-
"form-input-placeholder": !value,
|
|
49
|
-
}) }, value || placeholder)) : (React.createElement("input", { ref: inputRef, className: "form-input-center-native", maxLength: maxlength, name: name, pattern: pattern, placeholder: placeholder, type: type, value: value, onBlur: handleBlur, onInput: handleChange }))),
|
|
50
|
-
React.createElement("div", { className: "form-input-right" },
|
|
47
|
+
React.createElement("div", { className: "xh-form-input-center" }, readonly ? (React.createElement("p", { className: classNames("xh-form-input-readonly", {
|
|
48
|
+
"xh-form-input-placeholder": !value,
|
|
49
|
+
}) }, value || placeholder)) : (React.createElement("input", { ref: inputRef, className: "xh-form-input-center-native", maxLength: maxlength, name: name, pattern: pattern, placeholder: placeholder, type: type, value: value, onBlur: handleBlur, onInput: handleChange }))),
|
|
50
|
+
React.createElement("div", { className: "xh-form-input-right" },
|
|
51
51
|
RightComponent,
|
|
52
52
|
withArrow && React.createElement("i", { className: "arrow" }))));
|
|
53
53
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FormInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,MAAM,EAAE,mBAAmB,EAAO,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAc,MAAM,oBAAoB,CAAC;AACnE,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,cAAc,CAAC;AAuBtB,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAChC,CAAC,KAAqB,EAAE,OAAkB,EAAE,EAAE;IAC5C,MAAM,OAAO,GAAG,MAAM,EAAE,CAAC;IACzB,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,KAAK,EACL,IAAI,EACJ,WAAW,EACX,KAAK,EACL,SAAS,EACT,cAAc,EACd,MAAM,EACN,OAAO,EACP,aAAa,EACb,QAAQ,EACR,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,KAAK,EACjB,QAAQ,GACT,GAAG,KAAK,CAAC;IAEV,SAAS,YAAY,CAAC,CAAC;QACrB,IAAI,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5C,CAAC,CAAC,MAAM,CAAC,KAAK,GAAG,UAAU,CAAC;QAC5B,QAAQ,IAAI,QAAQ,CAAC,UAAU,CAAC,CAAC;IACnC,CAAC;IAED,SAAS,UAAU,CAAC,CAAC;QACnB,IAAI,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5C,MAAM,IAAI,MAAM,CAAC,UAAU,CAAC,CAAC;IAC/B,CAAC;IAED,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAEhD,mBAAmB,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC;QAClC,KAAK,EAAE,GAAG,EAAE;YACV,QAAQ,CAAC,OAAQ,CAAC,KAAK,EAAE,CAAC;QAC5B,CAAC;KACF,CAAC,CAAC,CAAC;IAEJ,IAAI,OAAO,KAAK,KAAK,EAAE;QACrB,OAAO,CACL,oBAAC,IAAI,IAAC,SAAS,EAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FormInput/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import React, { useEffect, useMemo, useState } from "react";
|
|
2
2
|
import { Image } from "@tarojs/components";
|
|
3
|
-
import { getImageInfo } from "@tarojs/taro";
|
|
3
|
+
import { getImageInfo, pxTransform } from "@tarojs/taro";
|
|
4
4
|
import "./index.scss";
|
|
5
5
|
import { useTaroEnv } from "../../../src/hooks";
|
|
6
6
|
const XHImage = (props) => {
|
|
7
7
|
const { width = "", height = "", src, className } = props;
|
|
8
8
|
const [defaultSize, setDefaultSize] = useState({});
|
|
9
|
-
// const style = { width: `${width}px`, height: `${height}px` }
|
|
10
9
|
const state = useTaroEnv();
|
|
11
10
|
useEffect(() => {
|
|
12
|
-
if (
|
|
11
|
+
if (process.env.TARO_ENV !== "h5" && !className) {
|
|
13
12
|
getImageInfo({
|
|
14
13
|
src,
|
|
15
14
|
success: (res) => {
|
|
@@ -20,12 +19,19 @@ const XHImage = (props) => {
|
|
|
20
19
|
},
|
|
21
20
|
});
|
|
22
21
|
}
|
|
22
|
+
else {
|
|
23
|
+
}
|
|
23
24
|
}, [state]);
|
|
24
25
|
const size = useMemo(() => {
|
|
25
|
-
|
|
26
|
-
|
|
26
|
+
let computedSize = defaultSize || {};
|
|
27
|
+
if (width) {
|
|
28
|
+
computedSize.width = `${pxTransform(width)}`;
|
|
29
|
+
}
|
|
30
|
+
if (height) {
|
|
31
|
+
computedSize.height = `${pxTransform(height)}`;
|
|
27
32
|
}
|
|
28
|
-
|
|
33
|
+
console.log("size");
|
|
34
|
+
return computedSize;
|
|
29
35
|
}, [width, height, defaultSize]);
|
|
30
36
|
return state !== "WEB" ? (React.createElement(Image, { src: src, style: size, className: className })) : (React.createElement("img", { src: src, alt: "", style: size, className: className }));
|
|
31
37
|
};
|
|
@@ -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,MAAM,cAAc,CAAC;
|
|
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,WAAW,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAShD,MAAM,OAAO,GAAmB,CAAC,KAAK,EAAE,EAAE;IACxC,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;IACd,MAAM,KAAK,GAAG,UAAU,EAAE,CAAC;IAE3B,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,CAAC,GAAG,EAAE,EAAE;oBACf,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,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,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,WAAW,CAAC,KAAK,CAAC,EAAE,CAAC;SACvD;QACD,IAAI,MAAM,EAAE;YACT,YAAoB,CAAC,MAAM,GAAG,GAAG,WAAW,CAAC,MAAM,CAAC,EAAE,CAAC;SACzD;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,KAAK,KAAK,KAAK,CAAC,CAAC,CAAC,CACvB,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"}
|