@gsretail.com/gui-core/build/core/Input/GuiInput.js

A skeleton to create your own React component library using Rollup, TypeScript, Sass and Storybook

import{__rest as e,__assign as a}from"../../node_modules/tslib/tslib.es6.js";import t from"react";import"../../node_modules/imask/esm/index.js";import"../../node_modules/imask/esm/controls/input.js";import"../../node_modules/imask/esm/masked/factory.js";import"../../node_modules/imask/esm/controls/mask-element.js";import"../../node_modules/imask/esm/controls/html-input-mask-element.js";import"../../node_modules/imask/esm/controls/html-mask-element.js";import"../../node_modules/imask/esm/controls/html-contenteditable-mask-element.js";import o from"../../node_modules/react-imask/esm/input.js";import"../../node_modules/react-imask/esm/mixin.js";import{NumericFormat as n}from"../../node_modules/react-number-format/dist/react-number-format.es.js";import{Box as l,TextField as i,InputAdornment as r}from"@mui/material";import{GuiIcon as m}from"../../node_modules/@gsretail.com/gui-icons/dist/index.js";import s from"./GuiInput.styled.js";var d=t.forwardRef((function(n,l){var i=n.onChange,r=e(n,["onChange"]);return t.createElement(o,a({inputRef:l,onAccept:function(e){return i({target:{name:n.name,value:e}})},overwrite:!0},r))})),u=t.forwardRef((function(o,l){var i=o.onChange,r=e(o,["onChange"]);return t.createElement(n,a({},r,{getInputRef:l,onValueChange:function(e){i({target:{name:o.name,value:e.value}})}}))})),c=s(t.forwardRef((function(o,n){var s=o.label,c=o.labelWidth,p=o.labelTextAlign,f=o.required,g=o.width,h=o.size,b=o.placeholder,v=o.disabled,x=o.readOnly,w=o.bold,k=o.textAlign,S=o.maxLength,j=o.startUnit,N=o.endUnit,I=o.startIcon,_=o.endIcon,E=o.startIconName,A=o.endIconName,C=o.autoFocus,y=o.onChange,O=o.isNumber,W=o.maskOptions,D=o.thousandSeparator,L=o.decimalSeparator,P=o.allowedDecimalSeparators,R=o.decimalScale,z=o.fixedDecimalScale,U=o.allowNegative,q=o.allowLeadingZeros,F=o.className,G=o.boxProps,Z=o.readOnlyWhite,T=e(o,["label","labelWidth","labelTextAlign","required","width","size","placeholder","disabled","readOnly","bold","textAlign","maxLength","startUnit","endUnit","startIcon","endIcon","startIconName","endIconName","autoFocus","onChange","isNumber","maskOptions","thousandSeparator","decimalSeparator","allowedDecimalSeparators","decimalScale","fixedDecimalScale","allowNegative","allowLeadingZeros","className","boxProps","readOnlyWhite"]),B=O?{thousandSeparator:D,decimalSeparator:L,allowedDecimalSeparators:P,decimalScale:R,fixedDecimalScale:z,allowNegative:U,allowLeadingZeros:q,valueIsNumericString:!!O}:{};return t.createElement(l,a({className:["gui-form gui-input",w&&"isBold",F&&F].join(" "),width:g},G),s&&t.createElement(l,{minWidth:c},t.createElement("label",{className:["gui-label",p&&"textAlign-"+p,f&&"Mui-required"].join(" ")},s)),t.createElement(l,{flexGrow:1},t.createElement(i,a({value:T.value,variant:T.variant,placeholder:b,size:h,fullWidth:!0,disabled:v,inputRef:n,InputProps:{autoFocus:!!C,inputComponent:W?d:O?u:void 0,inputProps:a(a(a({},W),B),{autoComplete:"off",style:{textAlign:k},maxLength:S}),className:x&&!Z?"Gui-readonly":void 0,readOnly:x,startAdornment:j||I||E?t.createElement(r,{position:"start"},j&&j,I&&I,E&&t.createElement(m,{name:E})):void 0,endAdornment:N||_||A?t.createElement(r,{position:"end"},N&&N,_&&_,A&&t.createElement(m,{name:A})):void 0},inputProps:{},onChange:y},T))))})));c.defaultProps={variant:"outlined",labelWidth:"auto",width:"100%",size:"small",textAlign:"left"};export{c as GuiInput,c as default};