@zym-com/input-search
Version:
搜索输入框
69 lines (68 loc) • 6.72 kB
JavaScript
this["echart-bar-interval"]=function(x){"use strict";var f={exports:{}},c={};/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/var u=x,m=Symbol.for("react.element"),b=Symbol.for("react.fragment"),T=Object.prototype.hasOwnProperty,$=u.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,C={key:!0,ref:!0,__self:!0,__source:!0};function g(l,e,i){var o,r={},s=null,h=null;i!==void 0&&(s=""+i),e.key!==void 0&&(s=""+e.key),e.ref!==void 0&&(h=e.ref);for(o in e)T.call(e,o)&&!C.hasOwnProperty(o)&&(r[o]=e[o]);if(l&&l.defaultProps)for(o in e=l.defaultProps,e)r[o]===void 0&&(r[o]=e[o]);return{$$typeof:m,type:l,key:s,ref:h,props:r,_owner:$.current}}c.Fragment=b,c.jsx=g,c.jsxs=g,f.exports=c;var n=f.exports;const a={boxClass:"_boxClass_1qhzk_1",inputClass:"_inputClass_1qhzk_4"};return({...l})=>{const e=l.configuration;console.log(l,e);const i=x.useRef(null);l.dataSource||requestAnimationFrame(()=>{i.current.value=""});let o="";if(e.textShadowChild){const t=e.shadow;o=t.shadowOffsetX+"px "+t.shadowOffsetY+"px "+t.shadowBlur+"px "+t.shadowColor}let r={};if(e.backgroundStyleChild){let t="";e.bgColorSelect=="solidBgColor"?t=e.solidBgColor:e.bgColorSelect=="gradientBgColor"?t="linear-gradient("+e.anamorphism.direction+"deg, "+e.anamorphism.startVal+", "+e.anamorphism.endVal+")":e.bgColorSelect=="BgImage"&&(t="url("+e.image+") center center / "+e.imageSize+" no-repeat "),r={background:t,borderRadius:e.borderRadiusName?e.borderRadiusName:0}}let s={};e.borderStyleChild&&(s={borderStyle:e.borderStyle,borderWidth:e.borderWidthName+"px",borderColor:e.borderColor});const h={width:l.base.width+"px",height:l.base.height+"px",...r,textShadow:o,color:e.textStyle.color,fontFamily:e.textStyle.fontFamily,fontSize:e.textStyle.fontSize+"px",fontStyle:e.textStyle.fontStyle,fontWeight:e.textStyle.fontWeight,letterSpacing:e.textStyle.letterSpacing+"px",textAlign:e.levelalignment,...s,opacity:e.transparency?e.transparency:1,paddingLeft:e.valuePadding.l+"px",paddingRight:e.valuePadding.r+"px",boxSizing:"border-box"};let y="";if(e.searchBtnWH){let t="";e.searchBtnType&&(e.searchBtnType=="solidBgColor"?t=`<span style='
color: ${e.searchBtnTextStyle.color};
font-family: ${e.searchBtnTextStyle.fontFamily};
font-size: ${e.searchBtnTextStyle.fontSize}px;
font-style: ${e.searchBtnTextStyle.fontStyle};
font-weight: ${e.searchBtnTextStyle.fontWeight};
letter-spacing: ${e.searchBtnTextStyle.letterSpacing}px;
text-indent: ${e.searchBtnTextStyle.letterSpacing}px;
'>${e.searchBtnText}</span>`:e.searchBtnType=="BgImage"&&(t=`
<img style="
width: ${e.searchBtnImgWH.W}px;
height: ${e.searchBtnImgWH.H}px;"
src=${e.searchBtnImage} />
`)),y=`<div style='
position: absolute;
right: ${e.searchBtnRT.R}px;
top:${e.searchBtnRT.T}%;
transform: translateY(-${e.searchBtnRT.T}%);
width: ${e.searchBtnWH.W}px;
height: ${e.searchBtnWH.H}px;
display:flex;
align-items: center;
justify-content: center;
cursor: pointer;
background: ${e.searchBtnBgStype?e.searchBtnBgStype=="solidBgColor"?e.searchBtnBgColor:"url("+e.searchBtnBgImage+") center center / cover no-repeat ":""};
border-radius: ${e.searchBtnBgStype?e.searchBtnBorderRadius:0}px;
'>${t}</div>`}const p={inputValueChange:(t,d,S)=>{S.valueTrigger&&d=="onchange"&&l.bindCallbackParams("onchange",{value:t.target.value}),S.blurTrigger&&d=="onblur"&&l.bindCallbackParams("onblur",{value:t.target.value})},btnClick:(t,d)=>{d&&l.bindCallbackParams(t,{value:i.current.value})}};return n.jsx(n.Fragment,{children:n.jsxs("div",{style:{width:l.base.width+"px",height:l.base.height+"px"},className:a.boxClass,children:[e.placeholderTextStyle&&n.jsx("style",{children:`
.${a.boxClass} input::-webkit-input-placeholder{
color: ${e.placeholderTextStyle.color};
font-family: ${e.placeholderTextStyle.fontFamily};
font-size: ${e.placeholderTextStyle.fontSize+"px"};
font-style: ${e.placeholderTextStyle.fontStyle};
font-weight: ${e.placeholderTextStyle.fontWeight};
letter-spacing: ${e.placeholderTextStyle.letterSpacing+"px"};
}
.${a.boxClass} input:-moz-placeholder{
color: ${e.placeholderTextStyle.color};
font-family: ${e.placeholderTextStyle.fontFamily};
font-size: ${e.placeholderTextStyle.fontSize+"px"};
font-style: ${e.placeholderTextStyle.fontStyle};
font-weight: ${e.placeholderTextStyle.fontWeight};
letter-spacing: ${e.placeholderTextStyle.letterSpacing+"px"};
}
.${a.boxClass} input::-moz-placeholder{
color: ${e.placeholderTextStyle.color};
font-family: ${e.placeholderTextStyle.fontFamily};
font-size: ${e.placeholderTextStyle.fontSize+"px"};
font-style: ${e.placeholderTextStyle.fontStyle};
font-weight: ${e.placeholderTextStyle.fontWeight};
letter-spacing: ${e.placeholderTextStyle.letterSpacing+"px"};
}
.${a.boxClass} input:-ms-input-placeholder{
color: ${e.placeholderTextStyle.color};
font-family: ${e.placeholderTextStyle.fontFamily};
font-size: ${e.placeholderTextStyle.fontSize+"px"};
font-style: ${e.placeholderTextStyle.fontStyle};
font-weight: ${e.placeholderTextStyle.fontWeight};
letter-spacing: ${e.placeholderTextStyle.letterSpacing+"px"};
}
`}),n.jsx("input",{ref:i,type:"text",defaultValue:l.dataSource,className:a.inputClass,style:h,placeholder:e.placeholderValue,onChange:t=>p.inputValueChange(t,"onchange",e),onBlur:t=>p.inputValueChange(t,"onblur",e)},l.dataSource),n.jsx("div",{dangerouslySetInnerHTML:{__html:y},onClick:()=>p.btnClick("onclick",e.clickTrigger)})]})})}}(React);