empower-custom-container
v0.1.9
Published
## Sample Usage ``` import { MenuBar, Modal } from react-empower-container;
Downloads
4
Maintainers
Keywords
Readme
Getting Started with Empower Container Component
Sample Usage
import { MenuBar, Modal } from react-empower-container;
const menuBarConfig = {
config: {
isWidget: true,
withTalent: true,
iconType: ["standard"],
showInfo: true,
title: "Sample title ",
icon: "Sample icon"
},
button: {
show: true,
actions: [
{
show: true,
label: "Sample label",
action: "Sample action"
icon: "Sample icon"
},
]
},
search: {
show: false,
value: "Sample value"
},
pagination: {
show: true,
hideSummary: true,
counter: 10,
perPage: 10,
page: 1,
total: 0,
},
pivot: {
show: true,
inputElement: {
id: 'statPivot',
type: 'select',
placeholder: 'Sample placeholder',
options: ["sample options"],
value: 30,
disabled: true,
required: true,
hideClearIcon: true
}
},
check: {
disabled: true,
selected: 0,
total: 0
},
toggle: {
buttons: [
{
icon: "Sample icon,
selectedIconDisplay: "Sample icon",
value: 'activated'
},
{
icon: "Sample icon",
selectedIconDisplay: "Sample icon",
value: 'deactivated'
}
]
},
mainButton: {
show: true,
label: 'Sample Label',
icon: 'Sample icon",
actions: []
},
buttonFooter: {
show: true,
className: 'buttonFooter',
actions: [
{
show: true,
label: 'Sample Label',
action: 'sample action',
icon: "Sample icon",
className: 'button'
}
]
},
undoButton: {
show: true,
actions: [
{
show: true,
label: "Sample label",
action: "submit",
icon: "Sample icon,
timer: "Number of seconds",
disabled: true
}
]
},
customClass: "Sample class name",
info: "Sample text",
}
const modalConfig = {
config: {
isWidget: true,
withTalent: true,
iconType: ['close', 'standard'],
showInfo: true,
modalSize: 'lg',
contentOnly: false,
title: 'Sample title',
icon: 'Sample icon"
},
show: this.props.show,
modalTitle: "Process Request",
button: {
show: true,
actions: [
{
show: true,
label: "Sample label",
action: "sample action"
icon: "Sample icon"
},
]
},
hideMenuBar: true
}
<MenuBar
config={menuBarConfig}
getActions={(action, data) => this.getActions(action, data)}
/>
<Modal
config={modalConfig}
getActions={(action, data) => this.getActions(action, data)}
/>