@chief-editor/ui/lib/components/input-number/InputNumberContent.js

UI Component for chief editor

"use strict";var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var u in t=arguments[r])Object.prototype.hasOwnProperty.call(t,u)&&(e[u]=t[u]);return e}).apply(this,arguments)},__rest=this&&this.__rest||function(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var u=0;for(n=Object.getOwnPropertySymbols(e);u<n.length;u++)t.indexOf(n[u])<0&&Object.prototype.propertyIsEnumerable.call(e,n[u])&&(r[n[u]]=e[n[u]])}return r},__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t.default=e,t};Object.defineProperty(exports,"__esModule",{value:!0});var icons_1=require("@byte-design/icons"),region_1=require("@rc-hooks/region"),use_1=require("@rc-hooks/use"),util_1=require("@co-hooks/util"),react_1=__importStar(require("react")),Input_1=require("../input/Input"),hooks_1=require("../../hooks"),const_1=require("../input-wrapper/const");function preventDefault(e){e.preventDefault()}function InputNumberContent(e){var t=e.className,r=e.style,n=e.disabled,u=void 0!==n&&n,s=e.hideButton,o=void 0===s||s,a=e.format,i=e.parse,l=e.prefix,c=e.suffix,_=e.onFocus,f=e.onBlur,p=e.needGrouped,d=void 0===p||p,b=e.forwardRef,m=__rest(e,["className","style","disabled","hideButton","format","parse","prefix","suffix","onFocus","onBlur","needGrouped","forwardRef"]),h=region_1.usePrecisionValue("end",region_1.AxisType.HORIZONTAL,a,i),v=h[0],y=h[1],O=h[2],k=react_1.useState(!1),C=k[0],g=k[1],x=region_1.useUpStep("end",region_1.AxisType.HORIZONTAL),I=x[0],N=x[1],w=region_1.useDownStep("end",region_1.AxisType.HORIZONTAL),P=w[0],R=w[1],A=use_1.useRefGetter(u),D=use_1.useRefCallback(f),S=use_1.useRefCallback(_),T=react_1.useRef(null);react_1.useImperativeHandle(b,(function(){var e=T.current;return{focus:function(){return e.focus()},blur:function(){return e.blur()},dom:e}}));var j=react_1.useCallback((function(){A()||N()}),[]),q=react_1.useCallback((function(){A()||R()}),[]),E=react_1.useCallback((function(e){A()||(38===e.keyCode?N():40===e.keyCode&&R())}),[]),M=react_1.useCallback((function(e){g(!0),S(e)}),[]),B=react_1.useCallback((function(e){O(),g(!1),D(e)}),[]),H=react_1.useCallback((function(e){return y(e.target.value)}),[]),F=Input_1.useInputAddOn("input-prefix",l),G=Input_1.useInputAddOn("input-suffix",c),L=hooks_1.usePrefixCls("can-input-grouped",{focus:C}),U=util_1.classnames(hooks_1.usePrefixCls("input-number",{focus:C,disabled:u,"add-prefix":!!l,"add-suffix":!!c}),t,d?L:""),Z=hooks_1.usePrefixCls("input-number-input"),K=hooks_1.usePrefixCls("input-number-controls",{hide:o}),V=hooks_1.usePrefixCls("input-number-controls-btn",{up:!0,disabled:I}),z=hooks_1.usePrefixCls("input-number-controls-btn",{down:!0,disabled:P}),J=util_1.pick(m,const_1.INPUT_COMMON_ATTRS),Q=J[0],W=J[1];return react_1.default.createElement("div",__assign({className:U,style:r},W,{onKeyDown:E}),F,react_1.default.createElement("input",__assign({},Q,{type:"text",className:Z,disabled:u,value:v,onBlur:B,onFocus:M,onChange:H,ref:T})),react_1.default.createElement("div",{className:K},react_1.default.createElement("span",{className:V,onClick:j,onMouseDown:preventDefault},react_1.default.createElement(icons_1.Up,null)),react_1.default.createElement("span",{className:z,onClick:q,onMouseDown:preventDefault},react_1.default.createElement(icons_1.Down,null))),G)}exports.InputNumberContent=InputNumberContent;