@iqmo/browser
Version:
Browser Stlite
2 lines (1 loc) • 7.68 kB
JavaScript
import{r as a,E as K,_ as X,d7 as y,K as g,M as G,l as be,c as z,z as ge,bO as fe,cZ as he,F as Z,j as n,bY as ve,bZ as ye,cb as we,b_ as Ie,bH as Te,D as xe,bW as Y}from"./index-C9lG8Cnd.js";import{u as ke}from"./uniqueId-C4k8y7l3.js";import{u as Ce}from"./FormClearHelper-CzLLXFUf.js";import{I as Re}from"./InputInstructions-CqDJXUWS.js";import{s as Se}from"./sprintf-CQZ7AWXD.js";import{I as ze}from"./input-BR77SZfi.js";var q=a.forwardRef(function(e,t){var i={fill:"currentColor",xmlns:"http://www.w3.org/2000/svg"};return a.createElement(K,X({iconAttrs:i,iconVerticalAlign:"middle",iconViewBox:"0 0 8 8"},e,{ref:t}),a.createElement("path",{d:"M0 3v2h8V3H0z"}))});q.displayName="Minus";var J=a.forwardRef(function(e,t){var i={fill:"currentColor",xmlns:"http://www.w3.org/2000/svg"};return a.createElement(K,X({iconAttrs:i,iconVerticalAlign:"middle",iconViewBox:"0 0 8 8"},e,{ref:t}),a.createElement("path",{d:"M3 0v3H0v2h3v3h2V5h3V3H5V0H3z"}))});J.displayName="Plus";const Ee=be.getLogger("NumberInput");function Ve(e){return g(e)||e===""?void 0:e}const W=({value:e,format:t,step:i,dataType:b})=>{if(g(e))return null;let c=Ve(t);if(g(c)&&G(i)){const r=i.toString();b===y.DataType.FLOAT&&i!==0&&r.includes(".")&&(c=`%0.${r.split(".")[1].length}f`)}if(g(c))return e.toString();try{return Se.sprintf(c,e)}catch(r){return Ee.warn(`Error in sprintf(${c}, ${e}): ${r}`),String(e)}},De=(e,t,i)=>g(e)?!1:e-t>=i,Ne=(e,t,i)=>g(e)?!1:e+t<=i,je=e=>(e.element.dataType===y.DataType.INT?e.widgetMgr.getIntValue(e.element):e.widgetMgr.getDoubleValue(e.element))??e.element.default??null,Q=({step:e,dataType:t})=>e||(t===y.DataType.INT?1:.01),We=z("div",{target:"e116k4er3"})(({theme:e})=>({display:"flex",flexDirection:"row",flexWrap:"nowrap",alignItems:"center",height:e.sizes.minElementHeight,borderWidth:e.sizes.borderWidth,borderStyle:"solid",borderColor:e.colors.widgetBorderColor??e.colors.secondaryBg,transitionDuration:"200ms",transitionProperty:"border",transitionTimingFunction:"cubic-bezier(0.2, 0.8, 0.4, 1)",borderRadius:e.radii.default,overflow:"hidden","&.focused":{borderColor:e.colors.primary},input:{MozAppearance:"textfield","&::-webkit-inner-spin-button, &::-webkit-outer-spin-button":{WebkitAppearance:"none",margin:e.spacing.none}}}),""),Fe=z("div",{target:"e116k4er2"})({name:"76z9jo",styles:"display:flex;flex-direction:row;align-self:stretch"}),ee=z("button",{target:"e116k4er1"})(({theme:e})=>({margin:e.spacing.none,border:"none",height:e.sizes.full,display:"flex",alignItems:"center",width:e.sizes.numberInputControlsWidth,justifyContent:"center",color:e.colors.bodyText,transition:"color 300ms, backgroundColor 300ms",backgroundColor:e.colors.secondaryBg,"&:hover:enabled, &:focus:enabled":{color:e.colors.white,backgroundColor:e.colors.primary,transition:"none",outline:"none"},"&:active":{outline:"none",border:"none"},"&:last-of-type":{borderTopRightRadius:e.radii.default,borderBottomRightRadius:e.radii.default},"&:disabled":{cursor:"not-allowed",color:e.colors.fadedText40}}),""),Be=z("div",{target:"e116k4er0"})(({theme:e,clearable:t})=>({position:"absolute",marginRight:e.spacing.twoXS,left:0,right:`calc(${e.sizes.numberInputControlsWidth} * 2 + ${t?"1em":"0em"})`}),""),Le=({disabled:e,element:t,widgetMgr:i,fragmentId:b})=>{var c;const r=ge(),{dataType:E,id:V,formId:p,default:F,format:B,icon:T,min:f,max:h}=t,[L,te]=fe(),[l,re]=a.useState(()=>Q(t)),M=je({element:t,widgetMgr:i}),[v,w]=a.useState(!1),[d,I]=a.useState(M),[A,x]=a.useState(()=>W({value:M,...t,step:l})),[H,U]=a.useState(!1),k=a.useRef(null),_=a.useRef(ke("number_input_")),C=De(d,l,f),R=Ne(d,l,h),$=he({formId:p}),ae=$?i.allowFormEnterToSubmit(p):v,oe=H&&L>r.breakpoints.hideWidgetDetails;a.useEffect(()=>{re(Q({step:t.step,dataType:t.dataType}))},[t.dataType,t.step]);const u=a.useCallback(({value:o,source:s})=>{var m;if(G(o)&&(f>o||o>h))(m=k.current)==null||m.reportValidity();else{const S=o??F??null;switch(E){case y.DataType.INT:i.setIntValue({id:V,formId:p},S,s,b);break;case y.DataType.FLOAT:i.setDoubleValue({id:V,formId:p},S,s,b);break;default:throw new Error("Invalid data type")}w(!1),I(S),x(W({value:S,dataType:E,format:B,step:l}))}},[f,h,k,i,b,l,E,V,p,F,B]),ie=a.useCallback(()=>{v&&u({value:d,source:{fromUi:!0}}),U(!1)},[v,d,u]),ne=a.useCallback(()=>{U(!0)},[]),O=a.useCallback(()=>{const{value:o}=t;t.setValue=!1,I(o??null),x(W({value:o??null,...t,step:l})),u({value:o??null,source:{fromUi:!1}})},[t,l,u]);a.useEffect(()=>{t.setValue?O():u({value:d,source:{fromUi:!1}});const o=k.current;if(o){const s=m=>{m.preventDefault()};return o.addEventListener("wheel",s),()=>{o.removeEventListener("wheel",s)}}},[]),t.setValue&&O();const D=g(t.default)&&!e,le=a.useCallback(()=>{const o=t.default??null;I(o),u({value:o,source:{fromUi:!0}})},[t]);Ce({element:t,widgetMgr:i,onFormCleared:le});const se=o=>{const{value:s}=o.target;if(s==="")w(!0),I(null),x(null);else{let m;t.dataType===y.DataType.INT?m=parseInt(s,10):m=parseFloat(s),w(!0),I(m),x(s)}},N=a.useCallback(()=>{R&&(w(!0),u({value:(d??f)+l,source:{fromUi:!0}}))},[d,f,l,R]),j=a.useCallback(()=>{C&&(w(!0),u({value:(d??h)-l,source:{fromUi:!0}}))},[d,h,l,C]),de=a.useCallback(o=>{const{key:s}=o;switch(s){case"ArrowUp":o.preventDefault(),N();break;case"ArrowDown":o.preventDefault(),j();break}},[N,j]),ue=a.useCallback(o=>{o.key==="Enter"&&(v&&u({value:d,source:{fromUi:!0}}),i.allowFormEnterToSubmit(p)&&i.submitForm(p,b))},[v,d,u,i,p,b]),P=T==null?void 0:T.startsWith(":material"),ce=P?"lg":"base",pe=Z(r.iconSizes.lg)+2*Z(r.spacing.twoXS),me=T?r.breakpoints.hideNumberInputControls+pe:r.breakpoints.hideNumberInputControls;return n.jsxs("div",{className:"stNumberInput","data-testid":"stNumberInput",ref:te,children:[n.jsx(ve,{label:t.label,disabled:e,labelVisibility:ye((c=t.labelVisibility)==null?void 0:c.value),htmlFor:_.current,children:t.help&&n.jsx(we,{children:n.jsx(Ie,{content:t.help,placement:Te.TOP_RIGHT})})}),n.jsxs(We,{className:H?"focused":"","data-testid":"stNumberInputContainer",children:[n.jsx(ze,{type:"number",inputRef:k,value:A??"",placeholder:t.placeholder,onBlur:ie,onFocus:ne,onChange:se,onKeyPress:ue,onKeyDown:de,clearable:D,clearOnEscape:D,disabled:e,"aria-label":t.label,startEnhancer:t.icon&&n.jsx(xe,{"data-testid":"stNumberInputIcon",iconValue:t.icon,size:ce}),id:_.current,overrides:{ClearIconContainer:{style:{padding:0}},ClearIcon:{props:{overrides:{Svg:{style:{color:r.colors.darkGray,padding:r.spacing.threeXS,height:r.sizes.clearIconSize,width:r.sizes.clearIconSize,":hover":{fill:r.colors.bodyText}}}}}},Input:{props:{"data-testid":"stNumberInputField",step:l,min:f,max:h,type:"number",inputMode:""},style:{lineHeight:r.lineHeights.inputWidget,paddingRight:r.spacing.sm,paddingLeft:r.spacing.md,paddingBottom:r.spacing.sm,paddingTop:r.spacing.sm}},InputContainer:{style:()=>({borderTopRightRadius:0,borderBottomRightRadius:0})},Root:{style:{borderTopRightRadius:0,borderBottomRightRadius:0,borderTopLeftRadius:0,borderBottomLeftRadius:0,borderLeftWidth:0,borderRightWidth:0,borderTopWidth:0,borderBottomWidth:0,paddingRight:0,paddingLeft:T?r.spacing.sm:0}},StartEnhancer:{style:{paddingLeft:0,paddingRight:0,minWidth:r.iconSizes.lg,color:P?r.colors.fadedText60:"inherit"}}}}),L>me&&n.jsxs(Fe,{children:[n.jsx(ee,{"data-testid":"stNumberInputStepDown",onClick:j,disabled:!C||e,tabIndex:-1,children:n.jsx(Y,{content:q,size:"xs",color:C?"inherit":r.colors.disabled})}),n.jsx(ee,{"data-testid":"stNumberInputStepUp",onClick:N,disabled:!R||e,tabIndex:-1,children:n.jsx(Y,{content:J,size:"xs",color:R?"inherit":r.colors.disabled})})]})]}),oe&&n.jsx(Be,{clearable:D,children:n.jsx(Re,{dirty:v,value:A??"",inForm:$,allowEnterToSubmit:ae})})]})},Me=a.memo(Le);export{Me as default};