@lanaco/lnc-react-ui
Version:
React component library
15 lines (12 loc) • 2.96 kB
JavaScript
"use strict";const l=require("react/jsx-runtime"),p=require("react"),e=require("./index-BPVoEhTF.cjs"),$=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),E=require("./DragAndDropFile.cjs"),G=require("./UploadedFile.cjs"),T=require("./utils-NZLCh-J5.cjs"),M=require("./FlexGrid.cjs"),g=require("./FlexGridItem.cjs"),U=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),V=$.newStyled.div`
display: flex;
flex-direction: column;
gap: 1rem;
border: ${n=>`1px solid ${T.getColorRgbaValue(n.theme,"DragDropFiles",n.color,"enabled","border")}`};
border-radius: ${n=>T.getBorderRadiusValueWithUnits(n.theme,"regular")};
padding: 1.25rem 2.5rem;
& .file-item-lnc {
padding: 0.5rem 0.813rem;
height: 100%;
}
`,P=p.forwardRef((n,h)=>{const{id:D="",disabled:x=!1,preventDefault:b=!1,acceptDropzone:F={},acceptInput:C,multiple:q=!0,selectFileText:j="Select file",dndFileText:w="Drag and drop file here or",control:z,showFileSize:d=!0,files:u=[],onChange:y=()=>{},onFocus:S=()=>{},onBlur:A=()=>{},onDropAccepted:m=()=>{},onDrop:f=()=>{},fileClick:R=()=>{},onCancel:O=()=>{},className:W="",style:H={},color:i="primary",size:c="small",dragAndDropFileProps:k,uploadedFileProps:t,...v}=n;var N={theme:U.useTheme(),size:c,color:i};const[o,a]=p.useState([]);p.useEffect(()=>{a(u)},[u]);const I=p.useCallback((r,s)=>{f&&f(r,s)},[]),_=p.useCallback(r=>{m&&m(r)},[]),B=r=>{var s;(s=r.target)!=null&&s.files?a([...o,...r.target.files]):r&&a([...o,...r]),y&&y(r)};return l.jsx(V,{ref:h,...N,...v,children:l.jsxs(M,{direction:"RowReverse",children:[l.jsx(g,{M:(o==null?void 0:o.length)>0?6:12,children:l.jsx(E,{id:D,disabled:x,preventDefault:b,acceptDropzone:F,acceptInput:C,multiple:q,selectFileText:j,dndFileText:w,control:z,showFileSize:d,showDnD:!((o==null?void 0:o.length)>0),onChange:B,onFocus:S,onBlur:A,onDrop:I,onDropAccepted:_,color:i,size:c,...k})}),o==null?void 0:o.map((r,s)=>l.jsx(g,{M:6,children:l.jsx(G,{fileName:r.name,fileSize:r.size,showFileSize:d,color:i,size:c,onFileClick:R,onCancel:O,...t,className:"file-item-lnc "+(t==null?void 0:t.className)},s)},s))]})})});P.propTypes={id:e.PropTypes.any,disabled:e.PropTypes.bool,preventDefault:e.PropTypes.bool,acceptDropzone:e.PropTypes.object,acceptInput:e.PropTypes.string,multiple:e.PropTypes.bool,selectFileText:e.PropTypes.string,dndFileText:e.PropTypes.oneOfType([e.PropTypes.string,e.PropTypes.element]),control:e.PropTypes.element,showFileSize:e.PropTypes.bool,files:e.PropTypes.array,onChange:e.PropTypes.func,onFocus:e.PropTypes.func,onBlur:e.PropTypes.func,onDropAccepted:e.PropTypes.func,onDrop:e.PropTypes.func,fileClick:e.PropTypes.func,onCancel:e.PropTypes.func,className:e.PropTypes.string,style:e.PropTypes.object,size:e.PropTypes.oneOf(["small","medium","large"]),color:e.PropTypes.oneOf(["primary","secondary","success","danger","warning","information","neutral","gray"]),dragAndDropFileProps:e.PropTypes.any,uploadedFileProps:e.PropTypes.any};module.exports=P;