@start-base/react-form-elements/Input/index.js

Simplify form elements and form management. Selection of user friendly inputs and wide customization abilities to match your design and functionality.

"use strict";var e=require("react"),l=require("clsx");function a(e){return e&&e.__esModule?e:{default:e}}var r=a(e),t=a(l),n=Object.defineProperty,u=Object.defineProperties,d=Object.getOwnPropertyDescriptors,o=Object.getOwnPropertySymbols,p=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,m=(e,l,a)=>l in e?n(e,l,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[l]=a,i=(e,l)=>{for(var a in l||(l={}))p.call(l,a)&&m(e,a,l[a]);if(o)for(var a of o(l))s.call(l,a)&&m(e,a,l[a]);return e},c="SUI-Input-module-root-Jh-4e",f="SUI-Input-module-inputRoot-Ug822",b="SUI-Input-module-label-fpxAl",I="SUI-Input-module-disableShrink-VTup6",S="SUI-Input-module-prepend-PTtkE",v="SUI-Input-module-placeholder-RxhY2",h="SUI-Input-module-labelPlaceholder-03rs3",N="SUI-Input-module-input-SMgjS",U="SUI-Input-module-disabledLabel-hKDBK",y="SUI-Input-module-append-TNa8b",C="SUI-Input-module-appendDisabledShrink-ULDV8",g="SUI-Input-module-prependDisabledShrink-5DxUo",E="SUI-Input-module-errorLabel-Qp8cB",O="SUI-Input-module-inputError-EeFMs",j="SUI-Input-module-disabled--Ng0A",k=e.forwardRef((l,a)=>{var n=l,{name:m,onChange:k,error:x=null,label:P=null,placeholder:w,value:D="",inputClassName:M=null,labelClassName:q=null,errorClassName:A=null,prepend:L=null,prependClassName:R=null,append:T=null,appendClassName:B=null,disableShrink:F=!1,disabled:K=!1}=n,V=((e,l)=>{var a={};for(var r in e)p.call(e,r)&&l.indexOf(r)<0&&(a[r]=e[r]);if(null!=e&&o)for(var r of o(e))l.indexOf(r)<0&&s.call(e,r)&&(a[r]=e[r]);return a})(n,["name","onChange","error","label","placeholder","value","inputClassName","labelClassName","errorClassName","prepend","prependClassName","append","appendClassName","disableShrink","disabled"]);const _=e.useCallback(e=>{k(e)},[k]),J=e.useMemo(()=>{let e=null;return x&&"string"==typeof x?e=x:x&&"object"==typeof x&&(null==x?void 0:x.message)&&(e=x.message),e},[x]),Q=e.useMemo(()=>r.default.createElement("input",i({type:"text",className:t.default(N,i({[I]:F||!P,[v]:P&&w&&!F,[j]:K,[O]:"boolean"==typeof x&&x},M?{[M]:!0}:{})),name:m,value:D,ref:a,onChange:_,disabled:K,placeholder:w},V)),[F,P,w,K,x,M,m,D,a,_,V]),Y=e.useMemo(()=>r.default.createElement("label",{htmlFor:m,className:t.default(b,i({[U]:K,[I]:F,[h]:P&&w&&!F},q?{[q]:!0}:{})),onClick:()=>{var e;try{const l=document.querySelectorAll(`[name="${m}"]`);if(!l.length)return;let a=l[0];"hidden"===(null==a?void 0:a.type)&&(a=null==(e=null==a?void 0:a.parentNode)?void 0:e.querySelector("input")),null==a||a.focus()}catch(e){throw e}}},P),[K,m,F,P,w,q]);return r.default.createElement("div",{className:t.default(c)},r.default.createElement("div",{className:t.default(f)},L&&r.default.createElement("div",{className:t.default(S,($=i({},R?{[R]:!0}:{}),z={[g]:F},u($,d(z))))},L),T&&r.default.createElement("div",{className:t.default(y,i({[C]:F},B?{[B]:!0}:{}))},T),P&&F?Y:null,Q,P&&!F?Y:null),J?r.default.createElement("span",{className:t.default(E,i({},A?{[A]:!0}:{}))},J):null);var $,z});k.displayName="Input";var x=k;module.exports=x;