🔹 Description
Description
...
🔹System Dependencies
🔹 Installation
The package can be installed via npm:
Code Block |
---|
npm install <package>i empower-profile-image --save |
🔹 Component Variation Title (ex. Alert with Dropdown)
Image Here
Configuration
Code Block |
---|
Insert Code Configuration Here |
🔹 Component Variation Title 2 (ex. Alert with Batch Message)
Configuration
...
Configuration
Code Block |
---|
import { ProfileImage, ProfileDetails, ImageCropper } from 'empower-profile-image';
..................
const paramImage = {
size: 'lg',
url:'',
placeholder: 'IN',
element1: 'Firstname Lastname',
element2: 'Reporting Job',
element3: 'Reporting Department',
}
const paramDetails = {
size: 'lg',
url:'',
placeholder: 'IN',
first_name: 'first_name',
last_name: 'last_name',
job: 'position title',
department: 'department name',
site: 'site',
employeNumber: 'employeNumber',
tenure: {
year: '2021',
month: 'Aug'
},
reportingTo: {
url:'',
placeholder: 'IN',
first_name: 'Reporting Firstname',
last_name: 'Reporting Lastname',
job: 'Reporting Job',
}
}
/**
*
* setUploadImage - method that gets the value of the Image cropper component
*/
const setUploadImage = (value) => {
console.log('VALUE', value)
}
......................
return (
<div className="App em-profile-image">
<h3>Profile Image Component</h3>
<ProfileImage config={paramImage} />
<h3>Profile Details Component</h3>
<ProfileDetails config={paramDetails} />
<h3>Image Cropper Component</h3>
<ImageCropper
uploadAction={(val) => setUploadImage(val)}
uploadResult={true}
/>
</div>
);
|
🔹 Properties
Parameter | Data Type | Constraint | Description |
---|---|---|---|
show | Boolean | Required | Sets the visibility of the component. |
class | String | Optional | Custom class for the alert component |
….. | …. | … | …. |
🔹 References
Repository Link: insert repo link https://gitlab.com/empowerteams/empower-profile-image.git
NPM Package: insert npm link: https://www.npmjs.com/package/empower-profile-image
Demo Repo: git@bitbucket.org:empowerteams/mfe-sub-application-template.git
...