koval-ui
Version:
React components collection with minimalistic design. Supports theming, layout, and input validation.
3 lines (2 loc) • 2.17 kB
JavaScript
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),t=require("react"),T=require("classnames"),B=require("../../internal/Icons/IconCalendar.cjs"),E=require("../../internal/inputs/ValidationProps.cjs"),P=require("../../internal/inputs/useValidation.cjs"),_=require("../../internal/inputs/useRevalidateOnFormChange.cjs"),z=require("../../internal/inputs/useExternalValidation.cjs"),A=require("../../internal/inputs/useValidationIcon.cjs"),G=require("../../internal/hooks/useInternalId.cjs"),H=require("../../internal/hooks/useInternalRef.cjs"),n=require("./InputDate.module.css.cjs"),q=t.forwardRef(({id:V,className:b,placeholder:g="YYYY-MM-DD",disabled:C,value:d,onChange:f=()=>{},onFocus:I=()=>{},onBlur:h=()=>{},onKeyDown:R=()=>{},onKeyUp:j=()=>{},defaultValue:m,revalidateOnFormChange:y,validation:l,errorMessage:N,displayIcon:p=!0,...s},k)=>{const D=!!l||typeof s.min=="string"||typeof s.max=="string",r=G.useInternalId(V),i=t.useRef(null),{validateTextual:o,validity:x,setValidity:u}=P.useValidation({validation:l,hasValidators:D}),c=H.useInternalRef(k);z.useExternalValidation({errorMessage:N,inputRef:c,setValidity:u,validation:l}),_.useRevalidateOnFormChange(c,o,y);const F=A.useValidationIcon(x),v=d??m,w=t.useCallback(e=>{f(e),i?.current&&(i.current.innerText=e.target.value)},[f]),Y=t.useCallback(()=>{u(E.ValidationState.error)},[u]),M=t.useCallback(e=>{I(e),e.target.showPicker()},[I]),O=t.useCallback(e=>{h(e)},[h]),S=t.useCallback(e=>{o(e)},[o]);return a.jsxs("div",{className:T(n.default.wrapper,{[n.default.withValidationIcon]:p},b),children:[a.jsxs("div",{className:n.default.toggle,children:[a.jsx("input",{...s,id:r,ref:c,className:n.default.input,type:"date",disabled:C,value:d,defaultValue:m,onChange:w,onInvalid:Y,onInput:S,onFocus:M,onBlur:O,onKeyUp:j,onKeyDown:R}),a.jsx("label",{htmlFor:r,className:n.default.icon,children:a.jsx(B.IconCalendar,{})})]}),a.jsx("label",{htmlFor:r,className:n.default.label,ref:i,children:v||g}),p&&x&&a.jsx(F,{className:n.default.validity})]})});q.displayName="InputDate";exports.InputDate=q;
//# sourceMappingURL=InputDate.cjs.map