Manage Files Component

Manage Files Component is custom ReactJs Component created for Sterling Talent Solutions F1Portal.

Features!

• Fully customizable and includes callback functions
• Can be included in both Aurelia and ReactJs
• Lightweight and reusable

This text you see here is actually written in Markdown! To get a feel for Markdown's syntax, type some text into the left window and watch the results in the right.

Tech

Manage File Component uses below mentioned Libraries/Frameworks to work properly:

• ReactJS
• Web Pack
• BabelJS
• Twitter Bootstrap
• node.js

Installation

Manage File Component requires Node.js to run.

$ npm i manage-files-component -s

Import Component in required file using below line

import ManageFilesComponent from 'manage-files-component';

Render the function and pass props to it as per your requirement

<ManageFilesComponent />

Prop Types and their default values

Manage File component has several prop types along with their default values

| Props Variable (Type) (Required) | Default Value | | ------ | ------ | | isPopup (boolean) (Optional) | false | | aureliaInstance (object) (Conditional) | NA | | calledFromAurelia (boolean) (Optional) | false | | isViewFilesSectionVisible (boolean) (Optional) | true | | titleTxt (string) (Optional) | Manage Files | | browseFileButtonLabel (string) (Optional) | Browse Files | | attachFileButtonLabel (string) (Optional) | Attach File | | viewAttachedFilesTxt (string) (Optional) | View Attached Files | | fileTypeLabelTxt (string) (Optional) | Select the type of file to attach | | browseFileAcceptType (string) (Optional) | .png, .jpe, .jpeg, .jpg, .gif, .bmp, .ico, .tiff, .tif, .svg, .svgz, .pdf, .txt, .zip, .doc, .docx, .xls, .xlsx, .dot, .html, .shtml, .txt, .text, .rtf | | docTypes (array) (Yes) | NA |

*NA - Not Applicable *Conditional - Required only if certain conditions are matched

Callbacks

Manage File Component provides below mentioned callback functions as proptypes which will be called on execution of their respective events:

• formSubmitCallback - callback function will be called when form is submitted
• validateFileCallback - callback function will be called whenever user selects new file to update. Callback function has to return boolean value so as to state if file is valid or not
• hidePanelCallback - Called whenever hide panel button is clicked
• viewAttachedFilesCallback - Called whenever view attached file link is clicked