@chief-editor/ui
Version:
UI Component for chief editor
1 lines • 3.27 kB
JavaScript
var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var n,o=1,t=arguments.length;o<t;o++)for(var s in n=arguments[o])Object.prototype.hasOwnProperty.call(n,s)&&(e[s]=n[s]);return e}).apply(this,arguments)},__rest=this&&this.__rest||function(e,n){var o={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&n.indexOf(t)<0&&(o[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var s=0;for(t=Object.getOwnPropertySymbols(e);s<t.length;s++)n.indexOf(t[s])<0&&Object.prototype.propertyIsEnumerable.call(e,t[s])&&(o[t[s]]=e[t[s]])}return o};import{CloseOne}from"@byte-design/icons";import{classnames,pick}from"@co-hooks/util";import{useCombineCallback}from"@rc-hooks/use";import React,{useState}from"react";import{useLocale,usePrefixCls}from"../../hooks";import{InputWrapper}from"../input-wrapper";import{INPUT_COMMON_ATTRS}from"./const";export var useInputAddOn=function(e,n){var o=usePrefixCls(e);return n?React.createElement("span",{className:o},n):null};export function Input(e){var n,o=useLocale("input.placeholder"),t=e.className,s=e.disabled,r=void 0!==s&&s,a=e.type,i=void 0===a?"text":a,p=e.invalid,u=void 0!==p&&p,l=e.clearable,c=void 0!==l&&l,d=e.needGrouped,f=void 0===d||d,m=e.value,C=void 0===m?"":m,y=e.prepend,b=e.append,v=e.suffix,x=e.prefix,O=e.style,h=e.onValueChange,_=e.onChange,P=e.onFocus,g=e.onBlur,E=e.onKeyDown,R=e.onKeyUp,w=e.onKeyPress,I=e.onPressEnter,N=e.onCompositionStart,k=e.onCompositionUpdate,M=e.onCompositionEnd,S=e.onMouseEnter,K=e.onMouseLeave,U=e.domRef,A=e.inputRef,j=__rest(e,["className","disabled","type","invalid","clearable","needGrouped","value","prepend","append","suffix","prefix","style","onValueChange","onChange","onFocus","onBlur","onKeyDown","onKeyUp","onKeyPress","onPressEnter","onCompositionStart","onCompositionUpdate","onCompositionEnd","onMouseEnter","onMouseLeave","domRef","inputRef"]),T=useState(!1),L=T[0],B=T[1],D=useState(!1),F=D[0],V=D[1],G=useCombineCallback((function(){return B(!0)}),S),W=useCombineCallback((function(){return B(!1)}),K),q=useCombineCallback((function(){return V(!0)}),P),z=useCombineCallback((function(){return V(!1)}),g),H=usePrefixCls("can-input-grouped",{focus:F}),J=classnames(usePrefixCls("input-wrapper"),f?H:"",t),Q=usePrefixCls("input-inner__wrapper",{hover:L,focus:F,disabled:r,readonly:j.readOnly,warning:u,"add-prepend":!!y,"add-append":!!b,"add-prefix":!!x,"add-suffix":!(!v&&!c)}),X=usePrefixCls("input"),Y=usePrefixCls("input-suffix"),Z=classnames(usePrefixCls("input-close-icon"),Y),$=useInputAddOn("input-prepend",y),ee=useInputAddOn("input-prefix",x),ne=useInputAddOn("input-append",b),oe=useInputAddOn("input-suffix",v),te=pick(j,INPUT_COMMON_ATTRS),se=te[0],re=te[1];return React.createElement("span",__assign({},re,{style:O,className:J,ref:U,onMouseEnter:G,onMouseLeave:W}),$,React.createElement(InputWrapper,__assign({},se,{className:Q,inputClassName:X,prefix:ee,suffix:oe,clear:c&&L&&React.createElement(CloseOne,{theme:"filled",className:Z}),placeholder:null!==(n=se.placeholder)&&void 0!==n?n:o,type:i,disabled:r,value:C,onChange:_,onValueChange:h,onKeyDown:E,onKeyUp:R,onKeyPress:w,onFocus:q,onBlur:z,onPressEnter:I,onCompositionStart:N,onCompositionUpdate:k,onCompositionEnd:M,inputRef:A})),ne)}