koval-ui/dist/src/lib/InputNumber/InputNumber.cjs

React components collection with minimalistic design. Supports theming, layout, and input validation.

"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),n=require("react"),U=require("classnames"),B=require("css-vars-hook"),F=require("../../internal/Icons/IconArrowUp.cjs"),M=require("../../internal/Icons/IconArrowDown.cjs"),I=require("../../internal/inputs/ValidationProps.cjs"),H=require("../../internal/inputs/useValidation.cjs"),Y=require("../../internal/inputs/useRevalidateOnFormChange.cjs"),G=require("../../internal/inputs/useExternalValidation.cjs"),J=require("../../internal/inputs/useValidationIcon.cjs"),K=require("../../internal/hooks/useInternalRef.cjs"),s=require("./InputNumber.module.css.cjs"),b="change_spinner",u=new Event(b,{bubbles:!0}),f=n.forwardRef(({className:h,placeholder:V="",disabled:q,value:x,onChange:o=()=>{},onFocus:N=()=>{},onBlur:E=()=>{},onKeyDown:w=()=>{},onKeyUp:R=()=>{},defaultValue:y,size:c=10,step:j,revalidateOnFormChange:C,errorMessage:g=I.ValidationState.error,validation:i,displayIcon:m=!0,...t},k)=>{const v=!!i||!!t.required||typeof t.min=="number"||typeof t.min=="string"||typeof t.max=="number"||typeof t.max=="string",{validateTextual:r,validity:p,setValidity:l}=H.useValidation({validation:i,hasValidators:v}),e=K.useInternalRef(k);Y.useRevalidateOnFormChange(e,r,C),G.useExternalValidation({errorMessage:g,inputRef:e,setValidity:l,validation:i});const S=J.useValidationIcon(p),T=n.useCallback(d=>{o(d)},[o]);n.useEffect(()=>{e.current?.addEventListener(b,d=>{o(d)})},[e,o]);const A=n.useCallback(()=>{l(I.ValidationState.error)},[l]),D=n.useCallback(()=>{e.current.stepDown(),e.current.dispatchEvent(u),r(u)},[e,r]),_=n.useCallback(()=>{e.current.stepUp(),e.current.dispatchEvent(u),r(u)},[e,r]),{LocalRoot:L}=B.useLocalTheme(),O=n.useMemo(()=>({size:c}),[c]);return a.jsxs(L,{className:U(s.default.wrapper,{[s.default.withValidationIcon]:m},h),theme:O,children:[a.jsxs("div",{className:s.default.spinner,children:[a.jsx(F.IconArrowUp,{tabIndex:-1,onClick:_}),a.jsx(M.IconArrowDown,{tabIndex:-1,onClick:D})]}),a.jsx("input",{...t,step:j,size:c,type:"number",placeholder:V,className:s.default.input,ref:e,disabled:q,value:x,defaultValue:y,onChange:T,onBlur:E,onFocus:N,onKeyUp:R,onKeyDown:w,onInvalid:A,onInput:r}),m&&p&&a.jsx(S,{className:s.default.validation})]})});f.displayName="InputNumber";exports.InputNumber=f;
//# sourceMappingURL=InputNumber.cjs.map