taro-react-uilib 1.0.23 → 1.0.25
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/Dialog/Confirm/index.js +1 -1
- package/dist/components/Dialog/Confirm/index.js.map +1 -1
- 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/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/dialog.scss +1 -1
- package/dist/styles/components/dialogref.scss +1 -1
- package/dist/styles/components/forminput.scss +0 -1
- package/dist/styles/components/toast.scss +13 -9
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__rest as e,__assign as o}from"../../node_modules/tslib/tslib.es6.js";import t,{createRef as n}from"react";import r from"react-dom";import{showModal as c}from"@tarojs/taro";import i from"../../DialogComponent/index.js";import m from"../../Button/index.js";var a=function(a){var f=a.title,l=void 0===f?"":f,s=a.content,u=a.confirmText,d=void 0===u?"确定":u,p=a.cancelText,x=void 0===p?"取消":p,h=e(a,["title","content","confirmText","cancelText"]);return new Promise((function(e){if("h5"===process.env.TARO_ENV){var a=document.createElement("div"),f=n(),u=t.createElement("div",{className:"xh-confirm-footer"},t.createElement(m,{shape:"rectangle",type:"ghost",className:"xh-confirm-footer-button xh-confirm-footer-cancel-button",onClick:function(){r.unmountComponentAtNode(a),e({errMsg:"ok",confirm:!1,cancel:!0})}},x),t.createElement(m,{shape:"rectangle",type:"ghost",className:"xh-confirm-footer-button xh-confirm-footer-confirm-button",onClick:function(){r.unmountComponentAtNode(a),e({errMsg:"ok",confirm:!0,cancel:!1})}},d));r.render(t.createElement(i,{header:l,footer:u,content:s,visible:!0,ref:f}),a)}else c(o({title:l,content:s,confirmColor:"#f6ab00",cancelText:x,
|
|
1
|
+
import{__rest as e,__assign as o}from"../../node_modules/tslib/tslib.es6.js";import t,{createRef as n}from"react";import r from"react-dom";import{showModal as c}from"@tarojs/taro";import i from"../../DialogComponent/index.js";import m from"../../Button/index.js";var a=function(a){var f=a.title,l=void 0===f?"":f,s=a.content,u=a.confirmText,d=void 0===u?"确定":u,p=a.cancelText,x=void 0===p?"取消":p,h=e(a,["title","content","confirmText","cancelText"]);return new Promise((function(e){if("h5"===process.env.TARO_ENV){var a=document.createElement("div"),f=n(),u=t.createElement("div",{className:"xh-confirm-footer"},t.createElement(m,{shape:"rectangle",type:"ghost",className:"xh-confirm-footer-button xh-confirm-footer-cancel-button",onClick:function(){r.unmountComponentAtNode(a),e({errMsg:"ok",confirm:!1,cancel:!0})}},x),t.createElement(m,{shape:"rectangle",type:"ghost",className:"xh-confirm-footer-button xh-confirm-footer-confirm-button",onClick:function(){r.unmountComponentAtNode(a),e({errMsg:"ok",confirm:!0,cancel:!1})}},d));r.render(t.createElement(i,{header:l,footer:u,content:s,visible:!0,ref:f}),a)}else c(o({title:l,content:s,confirmColor:"#f6ab00",cancelText:x,confirmText:d},h)).then(e)}))};export{a as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/Dialog/Confirm/index.tsx"],"sourcesContent":["import React, { createRef } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { showModal } from \"@tarojs/taro\";\nimport DialogComponent, { DialogRef } from \"../../DialogComponent\";\nimport Button from \"../../Button\";\nimport \"./index.scss\";\n\nexport type ConfirmProps = {\n title?: string;\n header?: string;\n content: string;\n cancelText?: string;\n confirmText?: string;\n} & {\n /** 取消按钮的文字颜色，必须是 16 进制格式的颜色字符串 */\n cancelColor?: string;\n /** 取消按钮的文字，最多 4 个字符 */\n cancelText?: string;\n /** 接口调用结束的回调函数（调用成功、失败都会执行） */\n complete?: (res: TaroGeneral.CallbackResult) => void;\n /** 确认按钮的文字颜色，必须是 16 进制格式的颜色字符串 */\n confirmColor?: string;\n /** 确认按钮的文字，最多 4 个字符 */\n confirmText?: string;\n /** 提示的内容 */\n content?: string;\n /** 接口调用失败的回调函数 */\n fail?: (res: TaroGeneral.CallbackResult) => void;\n /** 接口调用成功的回调函数 */\n success?: (result: ConfirmPropsResult) => void;\n /** 提示的标题 */\n title?: string;\n};\n\nexport type ConfirmPropsResult = {\n /** 为 true 时，表示用户点击了取消（用于 Android 系统区分点击蒙层关闭还是点击取消按钮关闭） */\n cancel: boolean;\n /** 为 true 时，表示用户点击了确定按钮 */\n confirm: boolean;\n /** 调用结果 */\n errMsg: string;\n};\nconst Comfirm = (props: ConfirmProps): Promise<ConfirmPropsResult> => {\n const {\n title = \"\",\n content,\n confirmText = \"确定\",\n cancelText = \"取消\",\n ...rest\n } = props;\n return new Promise(resolve => {\n if (process.env.TARO_ENV === \"h5\") {\n const div = document.createElement(\"div\");\n\n const dialogRef = createRef<DialogRef>();\n const alertFooter = (\n <div className=\"xh-confirm-footer\">\n <Button\n shape=\"rectangle\"\n type=\"ghost\"\n className=\"xh-confirm-footer-button xh-confirm-footer-cancel-button\"\n onClick={() => {\n ReactDOM.unmountComponentAtNode(div);\n resolve({ errMsg: \"ok\", confirm: false, cancel: true });\n }}\n >\n {cancelText}\n </Button>\n <Button\n shape=\"rectangle\"\n type=\"ghost\"\n className=\"xh-confirm-footer-button xh-confirm-footer-confirm-button\"\n onClick={() => {\n ReactDOM.unmountComponentAtNode(div);\n resolve({ errMsg: \"ok\", confirm: true, cancel: false });\n }}\n >\n {confirmText}\n </Button>\n </div>\n );\n ReactDOM.render(\n <DialogComponent\n header={title}\n footer={alertFooter}\n content={content}\n visible\n ref={dialogRef}\n />,\n div\n );\n } else {\n showModal({\n title,\n content,\n confirmColor: \"#f6ab00\",\n cancelText,\n
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/Dialog/Confirm/index.tsx"],"sourcesContent":["import React, { createRef } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { showModal } from \"@tarojs/taro\";\nimport DialogComponent, { DialogRef } from \"../../DialogComponent\";\nimport Button from \"../../Button\";\nimport \"./index.scss\";\n\nexport type ConfirmProps = {\n title?: string;\n header?: string;\n content: string;\n cancelText?: string;\n confirmText?: string;\n} & {\n /** 取消按钮的文字颜色，必须是 16 进制格式的颜色字符串 */\n cancelColor?: string;\n /** 取消按钮的文字，最多 4 个字符 */\n cancelText?: string;\n /** 接口调用结束的回调函数（调用成功、失败都会执行） */\n complete?: (res: TaroGeneral.CallbackResult) => void;\n /** 确认按钮的文字颜色，必须是 16 进制格式的颜色字符串 */\n confirmColor?: string;\n /** 确认按钮的文字，最多 4 个字符 */\n confirmText?: string;\n /** 提示的内容 */\n content?: string;\n /** 接口调用失败的回调函数 */\n fail?: (res: TaroGeneral.CallbackResult) => void;\n /** 接口调用成功的回调函数 */\n success?: (result: ConfirmPropsResult) => void;\n /** 提示的标题 */\n title?: string;\n};\n\nexport type ConfirmPropsResult = {\n /** 为 true 时，表示用户点击了取消（用于 Android 系统区分点击蒙层关闭还是点击取消按钮关闭） */\n cancel: boolean;\n /** 为 true 时，表示用户点击了确定按钮 */\n confirm: boolean;\n /** 调用结果 */\n errMsg: string;\n};\nconst Comfirm = (props: ConfirmProps): Promise<ConfirmPropsResult> => {\n const {\n title = \"\",\n content,\n confirmText = \"确定\",\n cancelText = \"取消\",\n ...rest\n } = props;\n return new Promise(resolve => {\n if (process.env.TARO_ENV === \"h5\") {\n const div = document.createElement(\"div\");\n\n const dialogRef = createRef<DialogRef>();\n const alertFooter = (\n <div className=\"xh-confirm-footer\">\n <Button\n shape=\"rectangle\"\n type=\"ghost\"\n className=\"xh-confirm-footer-button xh-confirm-footer-cancel-button\"\n onClick={() => {\n ReactDOM.unmountComponentAtNode(div);\n resolve({ errMsg: \"ok\", confirm: false, cancel: true });\n }}\n >\n {cancelText}\n </Button>\n <Button\n shape=\"rectangle\"\n type=\"ghost\"\n className=\"xh-confirm-footer-button xh-confirm-footer-confirm-button\"\n onClick={() => {\n ReactDOM.unmountComponentAtNode(div);\n resolve({ errMsg: \"ok\", confirm: true, cancel: false });\n }}\n >\n {confirmText}\n </Button>\n </div>\n );\n ReactDOM.render(\n <DialogComponent\n header={title}\n footer={alertFooter}\n content={content}\n visible\n ref={dialogRef}\n />,\n div\n );\n } else {\n showModal({\n title,\n content,\n confirmColor: \"#f6ab00\",\n cancelText,\n confirmText,\n ...rest,\n }).then(resolve);\n }\n });\n};\n\nexport default Comfirm;\n"],"names":["Comfirm","props","_a","title","content","_b","confirmText","_c","cancelText","rest","__rest","Promise","resolve","process","env","TARO_ENV","div_1","document","createElement","dialogRef","createRef","alertFooter","React","className","Button","shape","type","onClick","ReactDOM","unmountComponentAtNode","errMsg","confirm","cancel","render","DialogComponent","header","footer","visible","ref","showModal","__assign","confirmColor","then"],"mappings":"uQA0CM,IAAAA,EAAU,SAACC,GAEb,IAAAC,EAKED,EAAKE,MALPA,aAAQ,GAAED,EACVE,EAIEH,EAAKG,QAHPC,EAGEJ,cAHFK,OAAc,IAAAD,EAAA,OACdE,EAEEN,EAAKO,WAFPA,OAAU,IAAAD,EAAG,KAAIA,EACdE,EAAIC,EACLT,EANE,CAAA,QAAA,UAAA,cAAA,eAON,OAAO,IAAIU,SAAQ,SAAAC,GACjB,GAA6B,OAAzBC,QAAQC,IAAIC,SAAmB,CACjC,IAAMC,EAAMC,SAASC,cAAc,OAE7BC,EAAYC,IACZC,EACJC,EAAKJ,cAAA,MAAA,CAAAK,UAAU,qBACbD,EAAAJ,cAACM,EAAM,CACLC,MAAM,YACNC,KAAK,QACLH,UAAU,2DACVI,QAAS,WACPC,EAASC,uBAAuBb,GAChCJ,EAAQ,CAAEkB,OAAQ,KAAMC,SAAS,EAAOC,QAAQ,GACjD,GAEAxB,GAEHc,EAAAJ,cAACM,EAAM,CACLC,MAAM,YACNC,KAAK,QACLH,UAAU,4DACVI,QAAS,WACPC,EAASC,uBAAuBb,GAChCJ,EAAQ,CAAEkB,OAAQ,KAAMC,SAAS,EAAMC,QAAQ,GACjD,GAEC1B,IAIPsB,EAASK,OACPX,EAACJ,cAAAgB,EACC,CAAAC,OAAQhC,EACRiC,OAAQf,EACRjB,QAASA,EACTiC,SACA,EAAAC,IAAKnB,IAEPH,EAEH,MACCuB,EAASC,EAAA,CACPrC,MAAKA,EACLC,UACAqC,aAAc,UACdjC,aACAF,YAAWA,GACRG,IACFiC,KAAK9B,EAEZ,GACF"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import e,{useRef as a,useImperativeHandle as t}from"react";import{View as n,Text as r,Input as l}from"@tarojs/components";import{getEnv as m}from"@tarojs/taro";import o from"classnames";import{inputRange as c}from"../src/utils/index.js";var i=e.forwardRef((function(i,s){var u=m(),p=i.onChange,f=i.maxlength,h=i.value,d=i.type,x=i.placeholder,E=i.label,v=i.labelHtml,N=i.RightComponent,g=i.onBlur,b=i.pattern,w=i.LeftComponent,y=i.LeftIcon,I=i.name,L=i.readonly,B=void 0!==L&&L,_=i.withArrow,j=void 0!==_&&_,C=i.password,H=i.direction,M=void 0===H?"row":H,R=i.border,S=void 0===R||R,T=i.mainExtra,A=i.padding,W=void 0!==A&&A;function k(e){var a=c(e.target.value);e.target.value=a,p&&p(a)}function q(e){var a=c(e.target.value);g&&g(a)}var z=a(null);t(s,(function(){return{focus:function(){z.current.focus()}}}));var D=o("xh-form-input",{column:"column"===M,border:S,padding:W});return"WEB"!==u?e.createElement(n,{className:D},e.createElement(n,{className:"xh-form-input-main"},e.createElement(n,{className:"xh-form-input-main-left"},E&&e.createElement(n,{className:"xh-form-input-main-left-label"},E,y&&e.createElement(n,{className:"xh-form-input-main-left-label-icon"},y)),v&&e.createElement("label",{dangerouslySetInnerHTML:{__html:v},className:"label"}),e.createElement(n,null,w)),e.createElement(n,{className:"xh-form-input-main-center"},B?e.createElement(r,{className:o("xh-form-input-readonly",{"xh-form-input-placeholder":!h})},h||x):e.createElement(l,{ref:z,className:"xh-form-input-main-center-native",maxlength:f,name:I,placeholder:x,type:d,value:h,onBlur:q,onInput:k,password:C})),T&&e.createElement(n,{className:"xh-form-input-main-extra"},T)),e.createElement(n,{className:"xh-form-input-right"},N,j&&e.createElement(n,{className:"arrow"}))):e.createElement("div",{className:D},e.createElement("div",{className:"xh-form-input-main"},e.createElement("div",{className:"xh-form-input-main-left"},E&&e.createElement("label",{className:"xh-form-input-main-left-label"},E,y&&e.createElement("div",{className:"xh-form-input-main-left-label-icon"},y)),v&&e.createElement("label",{dangerouslySetInnerHTML:{__html:v},className:"label"}),e.createElement("div",null,w)),e.createElement("div",{className:"xh-form-input-main-center"},B?e.createElement("p",{className:o("xh-form-input-main-center-readonly",{"xh-form-input-main-placeholder":!h})},h||x):e.createElement("input",{ref:z,className:"xh-form-input-main-center-native",maxLength:f,name:I,pattern:b,placeholder:x,type:d,value:h,onBlur:q,onInput:k})),T&&e.createElement("div",{className:"xh-form-input-main-extra"},T)),e.createElement("div",{className:"xh-form-input-right"},N,j&&e.createElement("i",{className:"arrow"})))}));export{i as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/FormInput/index.tsx"],"sourcesContent":["import React, {
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/FormInput/index.tsx"],"sourcesContent":["import React, { ReactNode, useRef, useImperativeHandle, Ref } from \"react\";\nimport { Input, View, Text, InputProps } from \"@tarojs/components\";\nimport { getEnv } from \"@tarojs/taro\";\nimport classNames from \"classnames\";\nimport { inputRange } from \"../../utils/index\";\n\nimport \"./index.scss\";\n\nexport type HTMLFormType = \"tel\" | \"text\" | \"number\" | \"password\";\n\nexport type FormInputProps = {\n onChange?: (value: string) => void;\n onBlur?: (value: string) => void;\n value: string;\n maxlength?: number;\n placeholder?: string;\n type?: HTMLFormType | InputProps[\"type\"];\n pattern?: string;\n RightComponent?: ReactNode;\n label?: string;\n labelHtml?: string;\n LeftComponent?: ReactNode;\n LeftIcon?: ReactNode;\n name?: string;\n readonly?: boolean;\n withArrow?: boolean;\n direction?: \"row\" | \"column\";\n border?: boolean;\n mainExtra?: ReactNode;\n padding?: boolean;\n} & InputProps;\n\nexport type InputRef = Ref<{ focus: () => void }>;\nconst FormInput = React.forwardRef(\n (props: FormInputProps, formRef?: InputRef) => {\n const taroEnv = getEnv();\n const {\n onChange,\n maxlength,\n value,\n type,\n placeholder,\n label,\n labelHtml,\n RightComponent,\n onBlur,\n pattern,\n LeftComponent,\n LeftIcon,\n name,\n readonly = false,\n withArrow = false,\n password,\n direction = \"row\",\n border = true,\n mainExtra,\n padding = false,\n } = props;\n\n function handleChange(e): any {\n let inputValue = inputRange(e.target.value);\n e.target.value = inputValue;\n onChange && onChange(inputValue);\n }\n\n function handleBlur(e): any {\n let inputValue = inputRange(e.target.value);\n onBlur && onBlur(inputValue);\n }\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n useImperativeHandle(formRef, () => ({\n focus: () => {\n inputRef.current!.focus();\n },\n }));\n\n const wrapperCls = classNames(\"xh-form-input\", {\n column: direction === \"column\",\n border,\n padding,\n });\n\n console.log(LeftIcon);\n console.log(\"LeftIcon\");\n\n if (taroEnv !== \"WEB\") {\n return (\n <View className={wrapperCls}>\n <View className=\"xh-form-input-main\">\n <View className=\"xh-form-input-main-left\">\n {label && (\n <View className=\"xh-form-input-main-left-label\">\n {label}\n {LeftIcon && (\n <View className=\"xh-form-input-main-left-label-icon\">\n {LeftIcon}\n </View>\n )}\n </View>\n )}\n {labelHtml && (\n <label\n dangerouslySetInnerHTML={{ __html: labelHtml }}\n className=\"label\"\n />\n )}\n <View>{LeftComponent}</View>\n </View>\n <View className=\"xh-form-input-main-center\">\n {readonly ? (\n <Text\n className={classNames(\"xh-form-input-readonly\", {\n \"xh-form-input-placeholder\": !value,\n })}\n >\n {value || placeholder}\n </Text>\n ) : (\n <Input\n ref={inputRef}\n className=\"xh-form-input-main-center-native\"\n maxlength={maxlength}\n name={name}\n placeholder={placeholder}\n type={type as InputProps[\"type\"]}\n value={value}\n onBlur={handleBlur}\n onInput={handleChange}\n password={password}\n />\n )}\n </View>\n {mainExtra && (\n <View className=\"xh-form-input-main-extra\">{mainExtra}</View>\n )}\n </View>\n <View className=\"xh-form-input-right\">\n {RightComponent}\n {withArrow && <View className=\"arrow\" />}\n </View>\n </View>\n );\n }\n\n return (\n <div className={wrapperCls}>\n <div className=\"xh-form-input-main\">\n <div className=\"xh-form-input-main-left\">\n {label && (\n <label className=\"xh-form-input-main-left-label\">\n {label}\n {LeftIcon && (\n <div className=\"xh-form-input-main-left-label-icon\">\n {LeftIcon}\n </div>\n )}\n </label>\n )}\n {labelHtml && (\n <label\n dangerouslySetInnerHTML={{ __html: labelHtml }}\n className=\"label\"\n />\n )}\n <div>{LeftComponent}</div>\n </div>\n <div className=\"xh-form-input-main-center\">\n {readonly ? (\n <p\n className={classNames(\"xh-form-input-main-center-readonly\", {\n \"xh-form-input-main-placeholder\": !value,\n })}\n >\n {value || placeholder}\n </p>\n ) : (\n <input\n ref={inputRef}\n className=\"xh-form-input-main-center-native\"\n maxLength={maxlength}\n name={name}\n pattern={pattern}\n placeholder={placeholder}\n type={type}\n value={value}\n onBlur={handleBlur}\n onInput={handleChange}\n />\n )}\n </div>\n {mainExtra && (\n <div className=\"xh-form-input-main-extra\">{mainExtra}</div>\n )}\n </div>\n <div className=\"xh-form-input-right\">\n {RightComponent}\n {withArrow && <i className=\"arrow\" />}\n </div>\n </div>\n );\n }\n);\n\nexport default FormInput;\n"],"names":["FormInput","React","forwardRef","props","formRef","taroEnv","getEnv","onChange","maxlength","value","type","placeholder","label","labelHtml","RightComponent","onBlur","pattern","LeftComponent","LeftIcon","name","_a","readonly","_b","withArrow","password","_c","direction","_d","border","mainExtra","_e","padding","handleChange","e","inputValue","inputRange","target","handleBlur","inputRef","useRef","useImperativeHandle","focus","current","wrapperCls","classNames","column","createElement","View","className","dangerouslySetInnerHTML","__html","Text","Input","ref","onInput","maxLength"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__read as t}from"../node_modules/tslib/tslib.es6.js";import e,{useState as r,useEffect as
|
|
1
|
+
import{__read as t}from"../node_modules/tslib/tslib.es6.js";import e,{useState as r,useEffect as o,useMemo as s}from"react";import{Image as c}from"@tarojs/components";import{getImageInfo as i,pxTransform as a}from"@tarojs/taro";import{useTaroEnv as n}from"../src/hooks/index.js";var m=function(m){var h=m.width,l=void 0===h?"":h,f=m.height,d=void 0===f?"":f,u=m.src,g=m.className,p=t(r({}),2),v=p[0],j=p[1],w=n();o((function(){"h5"===process.env.TARO_ENV||g||i({src:u,success:function(t){"getImageInfo:ok"===t.errMsg&&j({width:t.width,height:t.height})}})}),[w]);var E=s((function(){var t=v||{};return l&&(t.width="".concat(a(l))),d&&(t.height="".concat(a(d))),t}),[l,d,v]);return"WEB"!==w?e.createElement(c,{src:u,style:E,className:g}):e.createElement("img",{src:u,alt:"",style:E,className:g})};export{m as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/Image/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useMemo, useState } from \"react\";\nimport { Image } from \"@tarojs/components\";\nimport { getImageInfo } from \"@tarojs/taro\";\nimport \"./index.scss\";\nimport { XHComponentCommonProps } from \"../../types\";\n\nexport type ImageProps = {\n width?: number;\n height?: number;\n src: string;\n} & XHComponentCommonProps;\n\nconst XHImage: FC<ImageProps> = props => {\n const { width = \"\", height = \"\", src, className } = props;\n const [defaultSize, setDefaultSize] = useState<{\n width?: number | string;\n height?: number | string;\n } | null>({});\n\n useEffect(() => {\n if (process.env.TARO_ENV !== \"h5\" && !className) {\n getImageInfo({\n src,\n success: res => {\n if (res.errMsg === \"getImageInfo:ok\") {\n console.log(res);\n setDefaultSize({ width: res.width, height: res.height });\n }\n },\n });\n } else {\n }\n }, []);\n\n const size = useMemo(() => {\n let computedSize = defaultSize || {};\n if (width) {\n (computedSize as any).width = `${width}`;\n }\n if (height) {\n (computedSize as any).height = `${height}`;\n }\n console.log(\"size\");\n\n return computedSize;\n }, [width, height, defaultSize]);\n\n return
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/Image/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useMemo, useState } from \"react\";\nimport { Image } from \"@tarojs/components\";\nimport { getImageInfo, pxTransform } from \"@tarojs/taro\";\nimport \"./index.scss\";\nimport { useTaroEnv } from \"../../../src/hooks\";\nimport { XHComponentCommonProps } from \"../../types\";\n\nexport type ImageProps = {\n width?: number;\n height?: number;\n src: string;\n} & XHComponentCommonProps;\n\nconst XHImage: FC<ImageProps> = (props) => {\n const { width = \"\", height = \"\", src, className } = props;\n const [defaultSize, setDefaultSize] = useState<{\n width?: number | string;\n height?: number | string;\n } | null>({});\n const state = useTaroEnv();\n\n useEffect(() => {\n if (process.env.TARO_ENV !== \"h5\" && !className) {\n getImageInfo({\n src,\n success: (res) => {\n if (res.errMsg === \"getImageInfo:ok\") {\n console.log(res);\n setDefaultSize({ width: res.width, height: res.height });\n }\n },\n });\n } else {\n }\n }, [state]);\n\n const size = useMemo(() => {\n let computedSize = defaultSize || {};\n if (width) {\n (computedSize as any).width = `${pxTransform(width)}`;\n }\n if (height) {\n (computedSize as any).height = `${pxTransform(height)}`;\n }\n console.log(\"size\");\n\n return computedSize;\n }, [width, height, defaultSize]);\n\n return state !== \"WEB\" ? (\n <Image src={src} style={size} className={className} />\n ) : (\n <img src={src} alt=\"\" style={size} className={className} />\n );\n};\n\nexport default XHImage;\n"],"names":["XHImage","props","_a","width","_b","height","src","className","_c","__read","useState","defaultSize","setDefaultSize","state","useTaroEnv","useEffect","process","env","TARO_ENV","getImageInfo","success","res","errMsg","size","useMemo","computedSize","concat","pxTransform","React","Image","style","createElement","alt"],"mappings":"uRAaM,IAAAA,EAA0B,SAACC,GACvB,IAAAC,EAA4CD,EAAKE,MAAjDA,OAAQ,IAAAD,EAAA,GAAEA,EAAEE,EAAgCH,EAArBI,OAAXA,OAAM,IAAAD,EAAG,GAAEA,EAAEE,EAAmBL,EAAhBK,IAAEC,EAAcN,EAAKM,UACnDC,EAAAC,EAAgCC,EAG5B,CAAE,GAAC,GAHNC,EAAWH,EAAA,GAAEI,OAIdC,EAAQC,IAEdC,GAAU,WACqB,OAAzBC,QAAQC,IAAIC,UAAsBX,GACpCY,EAAa,CACXb,IAAGA,EACHc,QAAS,SAACC,GACW,oBAAfA,EAAIC,QAENV,EAAe,CAAET,MAAOkB,EAAIlB,MAAOE,OAAQgB,EAAIhB,QAElD,GAIP,GAAG,CAACQ,IAEJ,IAAMU,EAAOC,GAAQ,WACnB,IAAIC,EAAed,GAAe,GASlC,OARIR,IACDsB,EAAqBtB,MAAQ,GAAAuB,OAAGC,EAAYxB,KAE3CE,IACDoB,EAAqBpB,OAAS,GAAAqB,OAAGC,EAAYtB,KAIzCoB,CACR,GAAE,CAACtB,EAAOE,EAAQM,IAEnB,MAAiB,QAAVE,EACLe,gBAACC,EAAK,CAACvB,IAAKA,EAAKwB,MAAOP,EAAMhB,UAAWA,IAEzCqB,EAAAG,cAAA,MAAA,CAAKzB,IAAKA,EAAK0B,IAAI,GAAGF,MAAOP,EAAMhB,UAAWA,GAElD"}
|