@tarojs/components-react 4.0.0-alpha.3 → 4.0.0-alpha.30

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.
Files changed (68) hide show
  1. package/LICENSE +8 -8
  2. package/dist/components/button/index.js +71 -68
  3. package/dist/components/button/index.js.map +1 -1
  4. package/dist/components/icon/index.js +16 -8
  5. package/dist/components/icon/index.js.map +1 -1
  6. package/dist/components/image/index.js +64 -67
  7. package/dist/components/image/index.js.map +1 -1
  8. package/dist/components/input/index.js +14 -9
  9. package/dist/components/input/index.js.map +1 -1
  10. package/dist/components/pull-down-refresh/index.js +30 -18
  11. package/dist/components/pull-down-refresh/index.js.map +1 -1
  12. package/dist/components/scroll-view/index.js +102 -104
  13. package/dist/components/scroll-view/index.js.map +1 -1
  14. package/dist/components/swiper/index.js +48 -30
  15. package/dist/components/swiper/index.js.map +1 -1
  16. package/dist/components/text/index.js +21 -17
  17. package/dist/components/text/index.js.map +1 -1
  18. package/dist/components/view/index.js +74 -77
  19. package/dist/components/view/index.js.map +1 -1
  20. package/dist/index.css +1 -1
  21. package/dist/solid/components/button/index.js +95 -0
  22. package/dist/solid/components/button/index.js.map +1 -0
  23. package/dist/solid/components/button/style/index.scss.js +4 -0
  24. package/dist/solid/components/button/style/index.scss.js.map +1 -0
  25. package/dist/solid/components/icon/index.js +39 -0
  26. package/dist/solid/components/icon/index.js.map +1 -0
  27. package/dist/solid/components/icon/style/index.scss.js +4 -0
  28. package/dist/solid/components/icon/style/index.scss.js.map +1 -0
  29. package/dist/solid/components/image/index.js +94 -0
  30. package/dist/solid/components/image/index.js.map +1 -0
  31. package/dist/solid/components/image/style/index.css.js +4 -0
  32. package/dist/solid/components/image/style/index.css.js.map +1 -0
  33. package/dist/solid/components/input/index.js +256 -0
  34. package/dist/solid/components/input/index.js.map +1 -0
  35. package/dist/solid/components/input/style/index.scss.js +4 -0
  36. package/dist/solid/components/input/style/index.scss.js.map +1 -0
  37. package/dist/solid/components/pull-down-refresh/index.js +334 -0
  38. package/dist/solid/components/pull-down-refresh/index.js.map +1 -0
  39. package/dist/solid/components/pull-down-refresh/style/index.css.js +4 -0
  40. package/dist/solid/components/pull-down-refresh/style/index.css.js.map +1 -0
  41. package/dist/solid/components/scroll-view/index.js +188 -0
  42. package/dist/solid/components/scroll-view/index.js.map +1 -0
  43. package/dist/solid/components/scroll-view/style/index.css.js +4 -0
  44. package/dist/solid/components/scroll-view/style/index.css.js.map +1 -0
  45. package/dist/solid/components/swiper/index.js +307 -0
  46. package/dist/solid/components/swiper/index.js.map +1 -0
  47. package/dist/solid/components/swiper/style/index.css.js +4 -0
  48. package/dist/solid/components/swiper/style/index.css.js.map +1 -0
  49. package/dist/solid/components/text/index.js +32 -0
  50. package/dist/solid/components/text/index.js.map +1 -0
  51. package/dist/solid/components/text/style/index.css.js +4 -0
  52. package/dist/solid/components/text/style/index.css.js.map +1 -0
  53. package/dist/solid/components/view/index.js +89 -0
  54. package/dist/solid/components/view/index.js.map +1 -0
  55. package/dist/solid/components/view/style/index.css.js +4 -0
  56. package/dist/solid/components/view/style/index.css.js.map +1 -0
  57. package/dist/solid/index.css +1 -0
  58. package/dist/solid/index.js +13 -0
  59. package/dist/solid/index.js.map +1 -0
  60. package/dist/solid/utils/hooks.js +55 -0
  61. package/dist/solid/utils/hooks.js.map +1 -0
  62. package/dist/solid/utils/index.js +58 -0
  63. package/dist/solid/utils/index.js.map +1 -0
  64. package/dist/utils/hooks.js +55 -0
  65. package/dist/utils/hooks.js.map +1 -0
  66. package/dist/utils/index.js +12 -1
  67. package/dist/utils/index.js.map +1 -1
  68. package/package.json +17 -16
package/LICENSE CHANGED
@@ -154,15 +154,8 @@ See `/LICENSE` for details of the license.
154
154
 
155
155
  ==================
156
156
 
157
- MIT (stencil-vue2-output-target):
158
- The following files embed [stencil-vue2-output-target](https://github.com/diondree/stencil-vue2-output-target) MIT:
159
- `/packages/taro-components-library-vue2/src/vue-component-lib/utils.ts`
160
- See `/LICENSE` for details of the license.
161
-
162
- ==================
163
-
164
157
  MIT (weui):
165
- The following files embed [stencil-vue2-output-target](https://github.com/Tencent/weui) MIT:
158
+ The following files embed [weui](https://github.com/Tencent/weui) MIT:
166
159
  `/packages/taro-components/src/components/*.scss`
167
160
  See `/LICENSE.txt` for details of the license.
168
161
 
@@ -172,3 +165,10 @@ Apache-2.0 (intersection-observer):
172
165
  The following files embed [intersection-observer](https://github.com/GoogleChromeLabs/intersection-observer) Apache-2.0:
173
166
  `/packages/taro-api/src/polyfill/intersection-observer.ts`
174
167
  See `/LICENSE.txt` for details of the license.
168
+
169
+ ==================
170
+
171
+ MIT (babel-plugin-jsx-dom-expressions):
172
+ The following files embed [babel-plugin-jsx-dom-expressions](https://github.com/ryansolid/dom-expressions/blob/main/packages/babel-plugin-jsx-dom-expressions) MIT:
173
+ `/packages/babel-plugin-transform-solid-jsx/src/*`
174
+ See `/LICENSE` for details of the license.
@@ -1,84 +1,87 @@
1
+ import { __rest } from 'tslib';
1
2
  import './style/index.scss.js';
2
3
  import classNames from 'classnames';
3
- import React from 'react';
4
- import { omit } from '../../utils/index.js';
4
+ import { omit, createForwardRefComponent } from '../../utils/index.js';
5
+ import { useRef, useState, useEffect } from '../../utils/hooks.js';
6
+ import { jsxs, jsx } from 'react/jsx-runtime';
5
7
 
6
- class Button extends React.Component {
7
- constructor(props) {
8
- super(props);
9
- this.state = {
10
- hover: false,
11
- touch: false
8
+ function Button(props) {
9
+ const startTimer = useRef();
10
+ const endTimer = useRef();
11
+ const [state, setState] = useState({
12
+ hover: false,
13
+ touch: false
14
+ });
15
+ useEffect(() => {
16
+ return () => {
17
+ startTimer.current && clearTimeout(startTimer.current);
18
+ endTimer.current && clearTimeout(endTimer.current);
12
19
  };
13
- }
14
- componentWillUnmount() {
15
- this.startTimer && clearTimeout(this.startTimer);
16
- this.endTimer && clearTimeout(this.endTimer);
17
- }
18
- render() {
19
- const {
20
+ }, []);
21
+ const _onTouchStart = e => {
22
+ setState(e => Object.assign(Object.assign({}, e), {
23
+ touch: true
24
+ }));
25
+ if (props.hoverClass && props.hoverClass !== 'none' && !props.disabled) {
26
+ startTimer.current = setTimeout(() => {
27
+ if (state.touch) {
28
+ setState(e => Object.assign(Object.assign({}, e), {
29
+ hover: true
30
+ }));
31
+ }
32
+ }, props.hoverStartTime || 20);
33
+ }
34
+ props.onTouchStart && props.onTouchStart(e);
35
+ };
36
+ const _onTouchEnd = e => {
37
+ setState(e => Object.assign(Object.assign({}, e), {
38
+ touch: false
39
+ }));
40
+ if (props.hoverClass && props.hoverClass !== 'none' && !props.disabled) {
41
+ endTimer.current = setTimeout(() => {
42
+ if (!state.touch) {
43
+ setState(e => Object.assign(Object.assign({}, e), {
44
+ hover: false
45
+ }));
46
+ }
47
+ }, props.hoverStayTime || 70);
48
+ }
49
+ props.onTouchEnd && props.onTouchEnd(e);
50
+ };
51
+ const {
52
+ forwardedRef,
20
53
  plain = false,
21
54
  children,
22
55
  disabled = false,
23
56
  className,
24
57
  style,
25
58
  onClick,
26
- onTouchStart,
27
- onTouchEnd,
28
59
  hoverClass = 'button-hover',
29
- hoverStartTime = 20,
30
- hoverStayTime = 70,
31
60
  loading = false,
32
61
  type
33
- } = this.props;
34
- const cls = classNames(className, 'taro-button-core', {
35
- [`${hoverClass}`]: this.state.hover && !disabled
36
- });
37
- const _onTouchStart = e => {
38
- this.setState(() => ({
39
- touch: true
40
- }));
41
- if (hoverClass && hoverClass !== 'none' && !disabled) {
42
- this.startTimer = setTimeout(() => {
43
- if (this.state.touch) {
44
- this.setState(() => ({
45
- hover: true
46
- }));
47
- }
48
- }, hoverStartTime);
49
- }
50
- onTouchStart && onTouchStart(e);
51
- };
52
- const _onTouchEnd = e => {
53
- this.setState(() => ({
54
- touch: false
55
- }));
56
- if (hoverClass && hoverClass !== 'none' && !disabled) {
57
- this.endTimer = setTimeout(() => {
58
- if (!this.state.touch) {
59
- this.setState(() => ({
60
- hover: false
61
- }));
62
- }
63
- }, hoverStayTime);
64
- }
65
- onTouchEnd && onTouchEnd(e);
66
- };
67
- return React.createElement("button", Object.assign({}, omit(this.props, ['hoverClass', 'onTouchStart', 'onTouchEnd', 'type', 'loading']), {
68
- type: type,
69
- className: cls,
70
- style: style,
71
- onClick: onClick,
72
- disabled: disabled,
73
- onTouchStart: _onTouchStart,
74
- onTouchEnd: _onTouchEnd,
75
- loading: loading.toString(),
76
- plain: plain.toString()
77
- }), !!loading && React.createElement("i", {
78
- className: 'weui-loading'
79
- }), children);
80
- }
62
+ } = props,
63
+ restProps = __rest(props, ["forwardedRef", "plain", "children", "disabled", "className", "style", "onClick", "hoverClass", "loading", "type"]);
64
+ const cls = classNames(className, 'taro-button-core', {
65
+ [`${hoverClass}`]: state.hover && !disabled
66
+ });
67
+ return /*#__PURE__*/jsxs("button", {
68
+ ...omit(restProps, ['hoverClass', 'onTouchStart', 'onTouchEnd', 'type', 'loading', 'forwardedRef']),
69
+ type: type,
70
+ ref: forwardedRef,
71
+ className: cls,
72
+ style: style,
73
+ onClick: onClick,
74
+ disabled: disabled,
75
+ onTouchStart: _onTouchStart,
76
+ onTouchEnd: _onTouchEnd,
77
+ loading: loading.toString(),
78
+ plain: plain.toString(),
79
+ children: [!!loading && /*#__PURE__*/jsx("i", {
80
+ className: "weui-loading"
81
+ }), children]
82
+ });
81
83
  }
84
+ var index = createForwardRefComponent(Button);
82
85
 
83
- export { Button as default };
86
+ export { index as default };
84
87
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/button/index.tsx"],"sourcesContent":["import './style/index.scss'\n\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport { omit } from '../../utils'\n\ninterface IProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> {\n size?: string\n plain?: boolean\n hoverClass?: string\n hoverStartTime?: number\n hoverStayTime?: number\n disabled?: boolean\n loading?: boolean\n type?: string\n className?: string\n}\n\ninterface IState {\n hover:boolean\n touch: boolean\n}\n\nclass Button extends React.Component<IProps, IState> {\n constructor (props) {\n super(props)\n this.state = {\n hover: false,\n touch: false\n }\n }\n\n startTimer: ReturnType<typeof setTimeout>\n endTimer: ReturnType<typeof setTimeout>\n\n componentWillUnmount () {\n this.startTimer && clearTimeout(this.startTimer)\n this.endTimer && clearTimeout(this.endTimer)\n }\n\n render () {\n const {\n plain = false,\n children,\n disabled = false,\n className,\n style,\n onClick,\n onTouchStart,\n onTouchEnd,\n hoverClass = 'button-hover',\n hoverStartTime = 20,\n hoverStayTime = 70,\n loading = false,\n type,\n } = this.props\n const cls = classNames(\n className,\n 'taro-button-core',\n {\n [`${hoverClass}`]: this.state.hover && !disabled\n }\n )\n\n const _onTouchStart = e => {\n this.setState(() => ({\n touch: true\n }))\n if (hoverClass && hoverClass !== 'none' && !disabled) {\n this.startTimer = setTimeout(() => {\n if (this.state.touch) {\n this.setState(() => ({\n hover: true\n }))\n }\n }, hoverStartTime)\n }\n onTouchStart && onTouchStart(e)\n }\n const _onTouchEnd = e => {\n this.setState(() => ({\n touch: false\n }))\n if (hoverClass && hoverClass !== 'none' && !disabled) {\n this.endTimer = setTimeout(() => {\n if (!this.state.touch) {\n this.setState(() => ({\n hover: false\n }))\n }\n }, hoverStayTime)\n }\n onTouchEnd && onTouchEnd(e)\n }\n\n return (\n <button\n {...omit(this.props, ['hoverClass', 'onTouchStart', 'onTouchEnd', 'type', 'loading'])}\n type={type}\n className={cls}\n style={style}\n onClick={onClick}\n disabled={disabled}\n onTouchStart={_onTouchStart}\n onTouchEnd={_onTouchEnd}\n loading={loading.toString()}\n plain={plain.toString()}\n >\n {!!loading && <i className='weui-loading' />}\n {children}\n </button>\n )\n }\n}\n\nexport default Button\n"],"names":["Button","React","Component","constructor","props","state","hover","touch","componentWillUnmount","startTimer","clearTimeout","endTimer","render","plain","children","disabled","className","style","onClick","onTouchStart","onTouchEnd","hoverClass","hoverStartTime","hoverStayTime","loading","type","cls","classNames","_onTouchStart","e","setState","setTimeout","_onTouchEnd","createElement","Object","assign","omit","toString"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/button/index.tsx"],"sourcesContent":["import './style/index.scss'\n\nimport classNames from 'classnames'\n\nimport { createForwardRefComponent, omit } from '../../utils'\nimport { useEffect, useRef, useState } from '../../utils/hooks'\n\nimport type React from 'react'\n\ninterface IProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> {\n size?: string\n plain?: boolean\n hoverClass?: string\n hoverStartTime?: number\n hoverStayTime?: number\n disabled?: boolean\n loading?: boolean\n type?: string\n className?: string\n forwardedRef?: React.MutableRefObject<HTMLButtonElement>\n}\n\ninterface IState {\n hover:boolean\n touch: boolean\n}\n\nfunction Button (props: IProps) {\n const startTimer = useRef<ReturnType<typeof setTimeout>>()\n const endTimer = useRef<ReturnType<typeof setTimeout>>()\n const [state, setState] = useState<IState>({\n hover: false,\n touch: false\n })\n\n useEffect(() => {\n return () => {\n startTimer.current && clearTimeout(startTimer.current)\n endTimer.current && clearTimeout(endTimer.current)\n }\n }, [])\n\n const _onTouchStart = (e: React.TouchEvent<HTMLButtonElement>) => {\n setState((e) => ({\n ...e,\n touch: true\n }))\n if (props.hoverClass && props.hoverClass !== 'none' && !props.disabled) {\n startTimer.current = setTimeout(() => {\n if ((state as IState).touch) {\n setState((e) => ({\n ...e,\n hover: true\n }))\n }\n }, props.hoverStartTime || 20)\n }\n props.onTouchStart && props.onTouchStart(e)\n }\n\n const _onTouchEnd = (e: React.TouchEvent<HTMLButtonElement>) => {\n setState((e) => ({\n ...e,\n touch: false\n }))\n if (props.hoverClass && props.hoverClass !== 'none' && !props.disabled) {\n endTimer.current = setTimeout(() => {\n if (!(state as IState).touch) {\n setState((e) => ({\n ...e,\n hover: false\n }))\n }\n }, props.hoverStayTime || 70)\n }\n props.onTouchEnd && props.onTouchEnd(e)\n }\n\n const { forwardedRef, plain = false, children, disabled = false, className, style, onClick, hoverClass = 'button-hover', loading = false, type, ...restProps } = props\n\n const cls = classNames(\n className,\n 'taro-button-core',\n {\n [`${hoverClass}`]: (state as IState).hover && !disabled\n }\n )\n\n return (\n <button\n {...omit(restProps, ['hoverClass', 'onTouchStart', 'onTouchEnd', 'type', 'loading', 'forwardedRef'])}\n type={type}\n ref={forwardedRef}\n className={cls}\n style={style}\n onClick={onClick}\n disabled={disabled}\n onTouchStart={_onTouchStart}\n onTouchEnd={_onTouchEnd}\n loading={loading.toString()}\n plain={plain.toString()}\n >\n {!!loading && <i className='weui-loading' />}\n {children}\n </button>\n )\n}\n\nexport default createForwardRefComponent(Button)\n"],"names":["Button","props","startTimer","useRef","endTimer","state","setState","useState","hover","touch","useEffect","current","clearTimeout","_onTouchStart","e","Object","assign","hoverClass","disabled","setTimeout","hoverStartTime","onTouchStart","_onTouchEnd","hoverStayTime","onTouchEnd","forwardedRef","plain","children","className","style","onClick","loading","type","restProps","__rest","cls","classNames","_jsxs","omit","ref","toString","_jsx","createForwardRefComponent"],"mappings":";;;;;;;AA2BA,SAASA,MAAMA,CAAEC,KAAa,EAAA;AAC5B,EAAA,MAAMC,UAAU,GAAGC,MAAM,EAAiC,CAAA;AAC1D,EAAA,MAAMC,QAAQ,GAAGD,MAAM,EAAiC,CAAA;AACxD,EAAA,MAAM,CAACE,KAAK,EAAEC,QAAQ,CAAC,GAAGC,QAAQ,CAAS;AACzCC,IAAAA,KAAK,EAAE,KAAK;AACZC,IAAAA,KAAK,EAAE,KAAA;AACR,GAAA,CAAC,CAAA;AAEFC,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,OAAO,MAAK;MACVR,UAAU,CAACS,OAAO,IAAIC,YAAY,CAACV,UAAU,CAACS,OAAO,CAAC,CAAA;MACtDP,QAAQ,CAACO,OAAO,IAAIC,YAAY,CAACR,QAAQ,CAACO,OAAO,CAAC,CAAA;KACnD,CAAA;GACF,EAAE,EAAE,CAAC,CAAA;EAEN,MAAME,aAAa,GAAIC,CAAsC,IAAI;AAC/DR,IAAAA,QAAQ,CAAEQ,CAAC,IAAKC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAC,MAAA,CAAA,EAAA,EACXF,CAAC,CAAA,EAAA;AACJL,MAAAA,KAAK,EAAE,IAAA;AAAI,KAAA,CACX,CAAC,CAAA;AACH,IAAA,IAAIR,KAAK,CAACgB,UAAU,IAAIhB,KAAK,CAACgB,UAAU,KAAK,MAAM,IAAI,CAAChB,KAAK,CAACiB,QAAQ,EAAE;AACtEhB,MAAAA,UAAU,CAACS,OAAO,GAAGQ,UAAU,CAAC,MAAK;QACnC,IAAKd,KAAgB,CAACI,KAAK,EAAE;AAC3BH,UAAAA,QAAQ,CAAEQ,CAAC,IAAKC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAC,MAAA,CAAA,EAAA,EACXF,CAAC,CAAA,EAAA;AACJN,YAAAA,KAAK,EAAE,IAAA;AAAI,WAAA,CACX,CAAC,CAAA;AACL,SAAA;AACF,OAAC,EAAEP,KAAK,CAACmB,cAAc,IAAI,EAAE,CAAC,CAAA;AAChC,KAAA;IACAnB,KAAK,CAACoB,YAAY,IAAIpB,KAAK,CAACoB,YAAY,CAACP,CAAC,CAAC,CAAA;GAC5C,CAAA;EAED,MAAMQ,WAAW,GAAIR,CAAsC,IAAI;AAC7DR,IAAAA,QAAQ,CAAEQ,CAAC,IAAKC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAC,MAAA,CAAA,EAAA,EACXF,CAAC,CAAA,EAAA;AACJL,MAAAA,KAAK,EAAE,KAAA;AAAK,KAAA,CACZ,CAAC,CAAA;AACH,IAAA,IAAIR,KAAK,CAACgB,UAAU,IAAIhB,KAAK,CAACgB,UAAU,KAAK,MAAM,IAAI,CAAChB,KAAK,CAACiB,QAAQ,EAAE;AACtEd,MAAAA,QAAQ,CAACO,OAAO,GAAGQ,UAAU,CAAC,MAAK;AACjC,QAAA,IAAI,CAAEd,KAAgB,CAACI,KAAK,EAAE;AAC5BH,UAAAA,QAAQ,CAAEQ,CAAC,IAAKC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAC,MAAA,CAAA,EAAA,EACXF,CAAC,CAAA,EAAA;AACJN,YAAAA,KAAK,EAAE,KAAA;AAAK,WAAA,CACZ,CAAC,CAAA;AACL,SAAA;AACF,OAAC,EAAEP,KAAK,CAACsB,aAAa,IAAI,EAAE,CAAC,CAAA;AAC/B,KAAA;IACAtB,KAAK,CAACuB,UAAU,IAAIvB,KAAK,CAACuB,UAAU,CAACV,CAAC,CAAC,CAAA;GACxC,CAAA;EAED,MAAM;MAAEW,YAAY;AAAEC,MAAAA,KAAK,GAAG,KAAK;MAAEC,QAAQ;AAAET,MAAAA,QAAQ,GAAG,KAAK;MAAEU,SAAS;MAAEC,KAAK;MAAEC,OAAO;AAAEb,MAAAA,UAAU,GAAG,cAAc;AAAEc,MAAAA,OAAO,GAAG,KAAK;AAAEC,MAAAA,IAAAA;AAAuB,KAAA,GAAA/B,KAAK;IAAnBgC,SAAS,GAAAC,MAAA,CAAKjC,KAAK,EAAhK,CAAA,cAAA,EAAA,OAAA,EAAA,UAAA,EAAA,UAAA,EAAA,WAAA,EAAA,OAAA,EAAA,SAAA,EAAA,YAAA,EAAA,SAAA,EAAA,MAAA,CAAwJ,CAAQ,CAAA;AAEtK,EAAA,MAAMkC,GAAG,GAAGC,UAAU,CACpBR,SAAS,EACT,kBAAkB,EAClB;IACE,CAAC,CAAA,EAAGX,UAAU,CAAE,CAAA,GAAIZ,KAAgB,CAACG,KAAK,IAAI,CAACU,QAAAA;AAChD,GAAA,CACF,CAAA;AAED,EAAA,oBACEmB,IAAA,CAAA,QAAA,EAAA;AAAA,IAAA,GACMC,IAAI,CAACL,SAAS,EAAE,CAAC,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC;AACpGD,IAAAA,IAAI,EAAEA,IAAK;AACXO,IAAAA,GAAG,EAAEd,YAAa;AAClBG,IAAAA,SAAS,EAAEO,GAAI;AACfN,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBZ,IAAAA,QAAQ,EAAEA,QAAS;AACnBG,IAAAA,YAAY,EAAER,aAAc;AAC5BW,IAAAA,UAAU,EAAEF,WAAY;AACxBS,IAAAA,OAAO,EAAEA,OAAO,CAACS,QAAQ,EAAG;AAC5Bd,IAAAA,KAAK,EAAEA,KAAK,CAACc,QAAQ,EAAG;AAAAb,IAAAA,QAAA,EAEvB,CAAA,CAAC,CAACI,OAAO,iBAAIU,GAAA,CAAA,GAAA,EAAA;AAAGb,MAAAA,SAAS,EAAC,cAAA;KAAc,CAAG,EAC3CD,QAAQ,CAAA;AAAA,GACH,CAAC,CAAA;AAEb,CAAA;AAEA,YAAee,yBAAyB,CAAC1C,MAAM,CAAC;;;;"}
@@ -1,14 +1,15 @@
1
1
  import './style/index.scss.js';
2
2
  import classNames from 'classnames';
3
- import React from 'react';
4
- import { omit } from '../../utils/index.js';
3
+ import { omit, createForwardRefComponent } from '../../utils/index.js';
4
+ import { jsx } from 'react/jsx-runtime';
5
5
 
6
6
  const Icon = props => {
7
7
  let {
8
8
  type,
9
9
  className = '',
10
10
  size = '23',
11
- color
11
+ color,
12
+ forwardedRef
12
13
  } = props;
13
14
  if (type) type = type.replace(/_/g, '-');
14
15
  const cls = classNames({
@@ -18,11 +19,18 @@ const Icon = props => {
18
19
  'font-size': size + 'px',
19
20
  color: color
20
21
  };
21
- return React.createElement("i", Object.assign({}, omit(props, ['type', 'className']), {
22
- className: cls,
23
- style: style
24
- }));
22
+ return (
23
+ /*#__PURE__*/
24
+ // eslint-disable-next-line react/react-in-jsx-scope
25
+ jsx("i", {
26
+ ref: forwardedRef,
27
+ ...omit(props, ['type', 'className', 'forwardedRef']),
28
+ className: cls,
29
+ style: style
30
+ })
31
+ );
25
32
  };
33
+ var index = createForwardRefComponent(Icon);
26
34
 
27
- export { Icon as default };
35
+ export { index as default };
28
36
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/icon/index.tsx"],"sourcesContent":["import './style/index.scss'\n\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport { omit } from '../../utils'\n\n\ninterface IProps {\n type: string\n color: string\n size?: number | string\n className?: string\n}\n\nconst Icon = (props: IProps) => {\n let { type, className = '', size = '23', color } = props\n if (type) type = type.replace(/_/g, '-')\n const cls = classNames(\n {\n [`weui-icon-${type}`]: true\n },\n className\n )\n const style = { 'font-size': size + 'px', color: color }\n\n return (\n <i {...omit(props, ['type', 'className'])} className={cls} style={style} />\n )\n}\nexport default Icon\n"],"names":["Icon","props","type","className","size","color","replace","cls","classNames","style","React","omit"],"mappings":";;;;;AAeMA,MAAAA,IAAI,GAAIC,KAAa,IAAI;EAC7B,IAAI;IAAEC,IAAI;AAAEC,IAAAA,SAAS,GAAG,EAAE;AAAEC,IAAAA,IAAI,GAAG,IAAI;AAAEC,IAAAA,KAAAA;AAAO,GAAA,GAAGJ,KAAK,CAAA;EACxD,IAAIC,IAAI,EAAEA,IAAI,GAAGA,IAAI,CAACI,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;EACxC,MAAMC,GAAG,GAAGC,UAAU,CACpB;IACE,CAAc,CAAA,UAAA,EAAAN,IAAM,CAAA,CAAA,GAAG,IAAA;GACxB,EACDC,SAAS,CACV,CAAA;AACD,EAAA,MAAMM,KAAK,GAAG;IAAE,WAAW,EAAEL,IAAI,GAAG,IAAI;AAAEC,IAAAA,KAAK,EAAEA,KAAAA;GAAO,CAAA;EAExD,OACEK,2CAAOC,IAAI,CAACV,KAAK,EAAE,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC,EAAE;AAAAE,IAAAA,SAAS,EAAEI,GAAG;AAAEE,IAAAA,KAAK,EAAEA,KAAAA;AAAS,GAAA,CAAA,CAAA,CAAA;AAE/E;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/icon/index.tsx"],"sourcesContent":["import './style/index.scss'\n\nimport classNames from 'classnames'\n\nimport { createForwardRefComponent, omit } from '../../utils'\n\ninterface IProps {\n type: string\n color: string\n size?: number | string\n className?: string\n forwardedRef?: React.MutableRefObject<HTMLLIElement>\n}\n\nconst Icon = (props: IProps) => {\n let { type, className = '', size = '23', color, forwardedRef } = props\n if (type) type = type.replace(/_/g, '-')\n const cls = classNames(\n {\n [`weui-icon-${type}`]: true\n },\n className\n )\n const style = { 'font-size': size + 'px', color: color }\n\n return (\n // eslint-disable-next-line react/react-in-jsx-scope\n <i ref={forwardedRef} {...omit(props, ['type', 'className', 'forwardedRef'])} className={cls} style={style} />\n )\n}\nexport default createForwardRefComponent(Icon)\n"],"names":["Icon","props","type","className","size","color","forwardedRef","replace","cls","classNames","style","_jsx","ref","omit","createForwardRefComponent"],"mappings":";;;;;AAcA,MAAMA,IAAI,GAAIC,KAAa,IAAI;EAC7B,IAAI;IAAEC,IAAI;AAAEC,IAAAA,SAAS,GAAG,EAAE;AAAEC,IAAAA,IAAI,GAAG,IAAI;IAAEC,KAAK;AAAEC,IAAAA,YAAAA;AAAc,GAAA,GAAGL,KAAK,CAAA;EACtE,IAAIC,IAAI,EAAEA,IAAI,GAAGA,IAAI,CAACK,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;EACxC,MAAMC,GAAG,GAAGC,UAAU,CACpB;IACE,CAAC,CAAA,UAAA,EAAaP,IAAI,CAAA,CAAE,GAAG,IAAA;GACxB,EACDC,SAAS,CACV,CAAA;AACD,EAAA,MAAMO,KAAK,GAAG;IAAE,WAAW,EAAEN,IAAI,GAAG,IAAI;AAAEC,IAAAA,KAAK,EAAEA,KAAAA;GAAO,CAAA;AAExD,EAAA;AAAA;AACE;IACAM,GAAA,CAAA,GAAA,EAAA;AAAGC,MAAAA,GAAG,EAAEN,YAAa;MAAA,GAAKO,IAAI,CAACZ,KAAK,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,cAAc,CAAC,CAAC;AAAEE,MAAAA,SAAS,EAAEK,GAAI;AAACE,MAAAA,KAAK,EAAEA,KAAAA;KAAM,CAAA;AAAG,IAAA;AAElH,CAAC,CAAA;AACD,YAAeI,yBAAyB,CAACd,IAAI,CAAC;;;;"}
@@ -1,45 +1,33 @@
1
1
  import { __rest } from 'tslib';
2
2
  import './style/index.css.js';
3
3
  import classNames from 'classnames';
4
- import React from 'react';
4
+ import { createForwardRefComponent } from '../../utils/index.js';
5
+ import { useRef, useState, useCallback, useEffect } from '../../utils/hooks.js';
6
+ import { jsx } from 'react/jsx-runtime';
5
7
 
6
- class Image extends React.Component {
7
- constructor(props) {
8
- super(props);
9
- this.observer = {};
10
- this.imgRef = null;
11
- this.state = {
12
- isLoaded: false
13
- };
14
- this.imageOnLoad = this.imageOnLoad.bind(this);
15
- // this.observer = {}
16
- }
17
-
18
- componentDidMount() {
19
- if (this.props.lazyLoad) {
20
- this.observer = new IntersectionObserver(entries => {
21
- // 异步 api 关系
22
- if (entries[entries.length - 1].isIntersecting) {
23
- this.setState({
24
- isLoaded: true
25
- }, () => {
26
- // findDOMNode(this).children[0].src = this.props.src
27
- this.imgRef.src = this.props.src;
28
- });
29
- }
30
- }, {
31
- rootMargin: '300px 0px'
32
- });
33
- this.observer.observe(this.imgRef);
34
- }
35
- }
36
- componentWillUnmount() {
37
- this.observer.disconnect && this.observer.disconnect();
38
- }
39
- imageOnLoad(e) {
8
+ function Image(props) {
9
+ const imgRef = useRef(null);
10
+ const observer = useRef({});
11
+ const [, setIsLoaded] = useState(false);
12
+ const {
13
+ className,
14
+ style = {},
15
+ src,
16
+ mode,
17
+ onError,
18
+ lazyLoad,
19
+ imgProps,
20
+ forwardedRef
21
+ } = props,
22
+ reset = __rest(props, ["className", "style", "src", "mode", "onError", "lazyLoad", "imgProps", "forwardedRef"]);
23
+ const cls = classNames('taro-img', {
24
+ 'taro-img__widthfix': mode === 'widthFix'
25
+ }, className);
26
+ const imgCls = classNames('taro-img__mode-' + (mode || 'scaleToFill').toLowerCase().replace(/\s/g, ''));
27
+ const imageOnLoad = useCallback(e => {
40
28
  const {
41
29
  onLoad
42
- } = this.props;
30
+ } = props;
43
31
  Object.defineProperty(e, 'detail', {
44
32
  enumerable: true,
45
33
  writable: true,
@@ -49,41 +37,50 @@ class Image extends React.Component {
49
37
  }
50
38
  });
51
39
  onLoad && onLoad(e);
52
- }
53
- render() {
54
- const _a = this.props,
55
- {
56
- className,
57
- style = {},
58
- src,
59
- mode,
60
- onError,
61
- lazyLoad,
62
- imgProps
63
- } = _a,
64
- reset = __rest(_a, ["className", "style", "src", "mode", "onError", "lazyLoad", "imgProps"]);
65
- const cls = classNames('taro-img', {
66
- 'taro-img__widthfix': mode === 'widthFix'
67
- }, className);
68
- const imgCls = classNames('taro-img__mode-' + (mode || 'scaleToFill').toLowerCase().replace(/\s/g, ''));
69
- return React.createElement("div", Object.assign({
70
- className: cls,
71
- style: style
72
- }, reset), lazyLoad ? React.createElement("img", Object.assign({
73
- ref: img => this.imgRef = img,
40
+ }, [props]);
41
+ useEffect(() => {
42
+ var _a, _b;
43
+ if (lazyLoad) {
44
+ observer.current = new IntersectionObserver(entries => {
45
+ // 异步 api 关系
46
+ if (entries[entries.length - 1].isIntersecting) {
47
+ setIsLoaded(true);
48
+ // findDOMNode(this).children[0].src = src
49
+ imgRef.current.src = src;
50
+ }
51
+ }, {
52
+ rootMargin: '300px 0px'
53
+ });
54
+ (_b = (_a = observer.current).observe) === null || _b === void 0 ? void 0 : _b.call(_a, imgRef.current);
55
+ }
56
+ return () => {
57
+ var _a, _b;
58
+ (_b = (_a = observer.current) === null || _a === void 0 ? void 0 : _a.disconnect) === null || _b === void 0 ? void 0 : _b.call(_a);
59
+ };
60
+ }, [lazyLoad, src]);
61
+ return /*#__PURE__*/jsx("div", {
62
+ className: cls,
63
+ style: style,
64
+ ref: forwardedRef,
65
+ ...reset,
66
+ children: lazyLoad ? /*#__PURE__*/jsx("img", {
67
+ ref: img => imgRef.current = img,
74
68
  className: imgCls,
75
69
  "data-src": src,
76
- onLoad: this.imageOnLoad,
77
- onError: onError
78
- }, imgProps)) : React.createElement("img", Object.assign({
79
- ref: img => this.imgRef = img,
70
+ onLoad: imageOnLoad,
71
+ onError: onError,
72
+ ...imgProps
73
+ }) : /*#__PURE__*/jsx("img", {
74
+ ref: img => imgRef.current = img,
80
75
  className: imgCls,
81
76
  src: src,
82
- onLoad: this.imageOnLoad,
83
- onError: onError
84
- }, imgProps)));
85
- }
77
+ onLoad: imageOnLoad,
78
+ onError: onError,
79
+ ...imgProps
80
+ })
81
+ });
86
82
  }
83
+ var index = createForwardRefComponent(Image);
87
84
 
88
- export { Image as default };
85
+ export { index as default };
89
86
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/image/index.tsx"],"sourcesContent":["import './style/index.css'\n\nimport classNames from 'classnames'\nimport React from 'react'\n\ninterface IProps extends React.HTMLAttributes<HTMLDivElement> {\n src: string\n mode: string\n onError: () => void\n onLoad: (e) => void\n lazyLoad?: boolean\n imgProps?: Record<string, any>\n}\n\nclass Image extends React.Component<IProps> {\n constructor (props) {\n super(props)\n this.state = {\n isLoaded: false\n }\n this.imageOnLoad = this.imageOnLoad.bind(this)\n // this.observer = {}\n }\n\n observer: any = {}\n imgRef: any = null\n\n componentDidMount () {\n if (this.props.lazyLoad) {\n this.observer = new IntersectionObserver(\n entries => {\n // 异步 api 关系\n if (entries[entries.length - 1].isIntersecting) {\n this.setState({ isLoaded: true }, () => {\n // findDOMNode(this).children[0].src = this.props.src\n this.imgRef.src = this.props.src\n })\n }\n },\n {\n rootMargin: '300px 0px'\n }\n )\n this.observer.observe(this.imgRef)\n }\n }\n\n componentWillUnmount () {\n this.observer.disconnect && this.observer.disconnect()\n }\n\n imageOnLoad (e) {\n const { onLoad } = this.props\n Object.defineProperty(e, 'detail', {\n enumerable: true,\n writable: true,\n value: {\n width: e.target.width,\n height: e.target.height\n }\n })\n\n onLoad && onLoad(e)\n }\n\n render () {\n const {\n className,\n style = {},\n src,\n mode,\n onError,\n lazyLoad,\n imgProps,\n ...reset\n } = this.props\n const cls = classNames(\n 'taro-img',\n {\n 'taro-img__widthfix': mode === 'widthFix'\n },\n className\n )\n const imgCls = classNames(\n 'taro-img__mode-' +\n (mode || 'scaleToFill').toLowerCase().replace(/\\s/g, '')\n )\n\n return (\n <div className={cls} style={style} {...reset}>\n {lazyLoad ? (\n <img\n ref={img => (this.imgRef = img)}\n className={imgCls}\n data-src={src}\n onLoad={this.imageOnLoad}\n onError={onError}\n {...imgProps}\n />\n ) : (\n <img\n ref={img => (this.imgRef = img)}\n className={imgCls}\n src={src}\n onLoad={this.imageOnLoad}\n onError={onError}\n {...imgProps}\n />\n )}\n </div>\n )\n }\n}\n\nexport default Image\n"],"names":["Image","React","Component","constructor","props","observer","imgRef","state","isLoaded","imageOnLoad","bind","componentDidMount","lazyLoad","IntersectionObserver","entries","length","isIntersecting","setState","src","rootMargin","observe","componentWillUnmount","disconnect","e","onLoad","Object","defineProperty","enumerable","writable","value","width","target","height","render","_a","className","style","mode","onError","imgProps","reset","__rest","cls","classNames","imgCls","toLowerCase","replace","createElement","assign","ref","img"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/image/index.tsx"],"sourcesContent":["import './style/index.css'\n\nimport classNames from 'classnames'\n\nimport { createForwardRefComponent } from '../../utils'\nimport { useCallback, useEffect, useRef, useState } from '../../utils/hooks'\n\nimport type React from 'react'\n\ninterface IProps extends React.HTMLAttributes<HTMLDivElement> {\n src: string\n mode: string\n onError: () => void\n onLoad: (e) => void\n lazyLoad?: boolean\n imgProps?: Record<string, any>\n forwardedRef?: React.MutableRefObject<HTMLDivElement>\n}\n\nfunction Image (props: IProps) {\n const imgRef = useRef<HTMLImageElement | null>(null)\n const observer = useRef<Partial<IntersectionObserver>>({})\n const [, setIsLoaded] = useState(false)\n const {\n className,\n style = {},\n src,\n mode,\n onError,\n lazyLoad,\n imgProps,\n forwardedRef,\n ...reset\n } = props\n const cls = classNames(\n 'taro-img',\n {\n 'taro-img__widthfix': mode === 'widthFix'\n },\n className\n )\n const imgCls = classNames(\n 'taro-img__mode-' +\n (mode || 'scaleToFill').toLowerCase().replace(/\\s/g, '')\n )\n\n const imageOnLoad = useCallback((e) => {\n const { onLoad } = props\n Object.defineProperty(e, 'detail', {\n enumerable: true,\n writable: true,\n value: {\n width: e.target.width,\n height: e.target.height\n }\n })\n\n onLoad && onLoad(e)\n }, [props])\n\n useEffect(() => {\n if (lazyLoad) {\n observer.current = new IntersectionObserver(\n entries => {\n // 异步 api 关系\n if (entries[entries.length - 1].isIntersecting) {\n setIsLoaded(true)\n // findDOMNode(this).children[0].src = src\n imgRef.current!.src = src\n }\n },\n {\n rootMargin: '300px 0px'\n }\n )\n observer.current.observe?.(imgRef.current!)\n }\n\n return () => {\n observer.current?.disconnect?.()\n }\n }, [lazyLoad, src])\n\n return (\n <div className={cls} style={style} ref={forwardedRef} {...reset}>\n {lazyLoad ? (\n <img\n ref={img => (imgRef.current = img)}\n className={imgCls}\n data-src={src}\n onLoad={imageOnLoad}\n onError={onError}\n {...imgProps}\n />\n ) : (\n <img\n ref={img => (imgRef.current = img)}\n className={imgCls}\n src={src}\n onLoad={imageOnLoad}\n onError={onError}\n {...imgProps}\n />\n )}\n </div>\n )\n}\n\nexport default createForwardRefComponent(Image)\n"],"names":["Image","props","imgRef","useRef","observer","setIsLoaded","useState","className","style","src","mode","onError","lazyLoad","imgProps","forwardedRef","reset","__rest","cls","classNames","imgCls","toLowerCase","replace","imageOnLoad","useCallback","e","onLoad","Object","defineProperty","enumerable","writable","value","width","target","height","useEffect","current","IntersectionObserver","entries","length","isIntersecting","rootMargin","_b","_a","observe","call","disconnect","_jsx","ref","children","img","createForwardRefComponent"],"mappings":"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"}
@@ -1,7 +1,8 @@
1
1
  import './style/index.scss.js';
2
2
  import classNames from 'classnames';
3
- import React from 'react';
4
- import { omit } from '../../utils/index.js';
3
+ import React__default from 'react';
4
+ import { omit, createForwardRefComponent } from '../../utils/index.js';
5
+ import { jsx } from 'react/jsx-runtime';
5
6
 
6
7
  function getTrueType(type, confirmType, password) {
7
8
  if (confirmType === 'search') type = 'search';
@@ -18,7 +19,7 @@ function getTrueType(type, confirmType, password) {
18
19
  function fixControlledValue(value) {
19
20
  return value !== null && value !== void 0 ? value : '';
20
21
  }
21
- class Input extends React.Component {
22
+ class Input extends React__default.Component {
22
23
  constructor(props) {
23
24
  super(props);
24
25
  this.handleBeforeInput = e => {
@@ -197,15 +198,18 @@ class Input extends React.Component {
197
198
  value
198
199
  } = this.props;
199
200
  const cls = classNames('taro-input-core', 'weui-input', className);
200
- const otherProps = omit(this.props, ['className', 'placeholder', 'disabled', 'password', 'type', 'maxlength', 'confirmType', 'focus', 'name']);
201
+ const otherProps = omit(this.props, ['forwardedRef', 'className', 'placeholder', 'disabled', 'password', 'type', 'maxlength', 'confirmType', 'focus', 'name']);
201
202
  if ('value' in this.props) {
202
203
  otherProps.value = fixControlledValue(value);
203
204
  }
204
- return React.createElement("input", Object.assign({
205
+ return /*#__PURE__*/jsx("input", {
205
206
  ref: input => {
207
+ if (this.props.forwardedRef) {
208
+ this.props.forwardedRef.current = input;
209
+ }
206
210
  this.inputRef = input;
207
- }
208
- }, otherProps, {
211
+ },
212
+ ...otherProps,
209
213
  className: cls,
210
214
  type: getTrueType(type, confirmType, password),
211
215
  placeholder: placeholder,
@@ -220,9 +224,10 @@ class Input extends React.Component {
220
224
  onCompositionStart: this.handleComposition,
221
225
  onCompositionEnd: this.handleComposition,
222
226
  onBeforeInput: this.handleBeforeInput
223
- }));
227
+ });
224
228
  }
225
229
  }
230
+ var index = createForwardRefComponent(Input);
226
231
 
227
- export { Input as default };
232
+ export { index as default };
228
233
  //# sourceMappingURL=index.js.map