empower-container 0.1.24 → 0.1.25

package/README.md

@@ -1,379 +1,379 @@
-# Getting Started with Empower Container
-1. Menubar
-2. Modal
-
-
-
-## 1) Menubar
-###  Implementation
-```js
-import { MenuBar } from 'empower-container';
-```
-### Options
-
-```js 
-config: {
-    title: 'Test Title',
-    icon: SVG_REQUEST,
-    showInfo: true,
-    iconType: ['check', "back", 'standard']
-}
-```
-```js
-mainButton: {
-    show: true,
-    label: 'File a Request',
-    icon: SVG_ADD,
-    actions: [
-        {
-            
-            label: "File Leave",
-            action: "leave",       // string optional
-            icon: SVG_SUBMIT
-        },
-        {
-            label: "File Overtime",
-            action: "overtime",       // string optional
-            icon: SVG_SUBMIT
-        },
-
-        {
-            label: "File Toil",
-            action: "toil",       // string optional
-            icon: SVG_SUBMIT
-        },
-
-        {
-            label: "File Amendment",
-            action: "amendment",       // string optional
-            icon: SVG_SUBMIT
-        }
-    ]
-}
-```
-
-```js
-button {
-    show: true
-    actions: [{
-        class: 'button',
-        label: "Submit",
-        action: "readytosubmit",       // string optional
-        icon: SVG_SUBMIT
-    }]
-}
-```
-```js
-buttonFooter: { 
-    show: true,
-    actions: [{
-            class: 'button',
-            label: "Submit",
-            action: "footer-submit",       // string optional
-            icon: SVG_SUBMIT,
-            show: true
-    }]
-}
-```
-```js
-pagination: {
-    show: true,
-    hideSummary: false,
-    counter: 10,
-    perPage: 10,
-    page: 1,
-    total: 35,
-}
-```
-```js 
-pivot: {
-    show: true,
-    selected: 'all',
-    actions: [
-        {
-            label: "All",
-            value: "all",       // string optional
-        },
-        {
-            label: "Pending",
-            value: "pending",       // string optional
-        },
-        {
-            label: "Approved",
-            value: "approved",       // string optional
-        },
-        {
-            label: "Rejected",
-            value: "rejected",       // string optional
-        },
-        {
-            label: "Cancelled",
-            value: "cancelled",    // string optional
-        },
-    ]
-}
-```
-```js
-dropdown: {
-    show: true,
-    title: 'File Test',
-    type: 'date-picker-monthly',
-    selection: {
-        startDate: "Feb 2021",
-        endDate: "Feb 2021",
-    },
-}
-```
-```js
-search: {
-    show: true,
-    value: ''
-}
-```
-```js 
-undoButton: {
-    show: false,
-    isFooter: true,
-    actions: [
-        {
-            class: 'button disabled',
-            show: true,
-            label: "Submit",
-            action: "submit",        
-            icon: SVG_SUBMIT,
-            timer: 3,
-            disabled: true
-        },
-        {
-            show: true,
-            label: "Undo Request",
-            action: "undo-request",        
-            icon: SVG_UNDO
-        },
-    ]
-}
-```
-```js 
-check: {
-    disabled: false,
-    selected: 0,
-    total: 1
-}
-```
-```js 
-info: 'Sample Information'
-```
-### Usage
-
-```html
- <MenuBar
-    config={menubar.config}
-    mainButton={menubar.mainButton}
-    button={menubar.button}
-    pagination={menubar.pagination}
-    pivot={menubar.pivot}
-    dropdown={menubar.dropdown}
-    search={menubar.search}
-    undoButton={menubar.undoButton}
-    buttonFooter={menubar.buttonFooter}
-    check={menubar.check}
-    info={menubar.info}
-
-    getActions={(action, data) => getActions(action, data)}
- >
-    <h2>CHILDREN DATA</h2>
-</MenuBar>
-```
-
-
-
-## 2) Modal
-### Implementation
-```js
-import { Modal } from 'empower-container';
-```
-### Options
-
-    show: false,
-    hideMenuBar: false, //optional
-    
-```js
-config: {
-    title: 'Test Title',
-    icon: SVG_REQUEST,
-    showInfo: true,
-    iconType: ['standard', 'close'],
-    modalSize: 'lg'
-}
-```
-```js
-mainButton: {
-    show: true,
-    label: 'File a Request',
-    icon: SVG_ADD,
-    actions: [
-        {
-            
-            label: "File Leave",
-            action: "leave",       // string optional
-            icon: SVG_SUBMIT
-        },
-        {
-            label: "File Overtime",
-            action: "overtime",       // string optional
-            icon: SVG_SUBMIT
-        },
-
-        {
-            label: "File Toil",
-            action: "toil",       // string optional
-            icon: SVG_SUBMIT
-        },
-
-        {
-            label: "File Amendment",
-            action: "amendment",       // string optional
-            icon: SVG_SUBMIT
-        }
-    ]
-}
-```
-
-```js    
-button {
-    show: true
-    actions: [{
-        class: 'button',
-        label: "Submit",
-        action: "readytosubmit",       // string optional
-        icon: SVG_SUBMIT
-    }]
-}
-```
-```js
-buttonFooter: { 
-    show: true,
-    actions: [{
-            class: 'button',
-            label: "Submit",
-            action: "footer-submit",       // string optional
-            icon: SVG_SUBMIT,
-            show: true
-    }]
-},
-```
-```js
-pagination: {
-    show: true,
-    hideSummary: false,
-    counter: 10,
-    perPage: 10,
-    page: 1,
-    total: 35,
-}
-```
-```js
-pivot: {
-    show: true,
-    selected: 'all',
-    actions: [
-        {
-            label: "All",
-            value: "all",       // string optional
-        },
-        {
-            label: "Pending",
-            value: "pending",       // string optional
-        },
-        {
-            label: "Approved",
-            value: "approved",       // string optional
-        },
-        {
-            label: "Rejected",
-            value: "rejected",       // string optional
-        },
-        {
-            label: "Cancelled",
-            value: "cancelled",    // string optional
-        },
-    ]
-}
-```
-```js
-dropdown: {
-    show: true,
-    title: 'File Test',
-    type: 'date-picker-monthly',
-    selection: {
-        startDate: "Feb 2021",
-        endDate: "Feb 2021",
-    },
-}
-```
-```js
-search: {
-    show: true,
-    value: ''
-}
-```
-```js
-undoButton: {
-    show: false,
-    isFooter: true,
-    actions: [
-        {
-            class: 'button disabled',
-            show: true,
-            label: "Submit",
-            action: "submit",       // string optional
-            icon: SVG_SUBMIT,
-            timer: 3,
-            disabled: true
-        },
-        {
-            show: true,
-            label: "Undo Request",
-            action: "undo-request",       // string optional
-            icon: SVG_UNDO
-        },
-    ]
-}
-```
-```js
-check: {
-    disabled: false,
-    selected: 0,
-    total: 1
-}
-```
-```js
-info: 'Sample Information'
-```
-### Usage
-```html
-<Modal
-    config={menubar.config}
-    mainButton={menubar.mainButton}
-    button={menubar.button}
-    pagination={menubar.pagination}
-    pivot={menubar.pivot}
-    dropdown={menubar.dropdown}
-    search={menubar.search}
-    undoButton={menubar.undoButton}
-    buttonFooter={menubar.buttonFooter}
-    check={menubar.check}
-    info={menubar.info}
-
-    getActions={(action, data) => getActions(action, data)}
->
-        <h2>CHILDREN DATA</h2>
-</Modal>
-```
-
-## Changelog
-* **0.1.24** - Fix close icon not appearing in info menubar
-* **0.1.22** - Added close icon on info menubar
-* **0.1.21** - Added mainbutton on modal
-* **0.1.18** - Fixed dynamic root issues
+# Getting Started with Empower Container
+1. Menubar
+2. Modal
+
+
+
+## 1) Menubar
+###  Implementation
+```js
+import { MenuBar } from 'empower-container';
+```
+### Options
+
+```js 
+config: {
+    title: 'Test Title',
+    icon: SVG_REQUEST,
+    showInfo: true,
+    iconType: ['check', "back", 'standard']
+}
+```
+```js
+mainButton: {
+    show: true,
+    label: 'File a Request',
+    icon: SVG_ADD,
+    actions: [
+        {
+            
+            label: "File Leave",
+            action: "leave",       // string optional
+            icon: SVG_SUBMIT
+        },
+        {
+            label: "File Overtime",
+            action: "overtime",       // string optional
+            icon: SVG_SUBMIT
+        },
+
+        {
+            label: "File Toil",
+            action: "toil",       // string optional
+            icon: SVG_SUBMIT
+        },
+
+        {
+            label: "File Amendment",
+            action: "amendment",       // string optional
+            icon: SVG_SUBMIT
+        }
+    ]
+}
+```
+
+```js
+button {
+    show: true
+    actions: [{
+        class: 'button',
+        label: "Submit",
+        action: "readytosubmit",       // string optional
+        icon: SVG_SUBMIT
+    }]
+}
+```
+```js
+buttonFooter: { 
+    show: true,
+    actions: [{
+            class: 'button',
+            label: "Submit",
+            action: "footer-submit",       // string optional
+            icon: SVG_SUBMIT,
+            show: true
+    }]
+}
+```
+```js
+pagination: {
+    show: true,
+    hideSummary: false,
+    counter: 10,
+    perPage: 10,
+    page: 1,
+    total: 35,
+}
+```
+```js 
+pivot: {
+    show: true,
+    selected: 'all',
+    actions: [
+        {
+            label: "All",
+            value: "all",       // string optional
+        },
+        {
+            label: "Pending",
+            value: "pending",       // string optional
+        },
+        {
+            label: "Approved",
+            value: "approved",       // string optional
+        },
+        {
+            label: "Rejected",
+            value: "rejected",       // string optional
+        },
+        {
+            label: "Cancelled",
+            value: "cancelled",    // string optional
+        },
+    ]
+}
+```
+```js
+dropdown: {
+    show: true,
+    title: 'File Test',
+    type: 'date-picker-monthly',
+    selection: {
+        startDate: "Feb 2021",
+        endDate: "Feb 2021",
+    },
+}
+```
+```js
+search: {
+    show: true,
+    value: ''
+}
+```
+```js 
+undoButton: {
+    show: false,
+    isFooter: true,
+    actions: [
+        {
+            class: 'button disabled',
+            show: true,
+            label: "Submit",
+            action: "submit",        
+            icon: SVG_SUBMIT,
+            timer: 3,
+            disabled: true
+        },
+        {
+            show: true,
+            label: "Undo Request",
+            action: "undo-request",        
+            icon: SVG_UNDO
+        },
+    ]
+}
+```
+```js 
+check: {
+    disabled: false,
+    selected: 0,
+    total: 1
+}
+```
+```js 
+info: 'Sample Information'
+```
+### Usage
+
+```html
+ <MenuBar
+    config={menubar.config}
+    mainButton={menubar.mainButton}
+    button={menubar.button}
+    pagination={menubar.pagination}
+    pivot={menubar.pivot}
+    dropdown={menubar.dropdown}
+    search={menubar.search}
+    undoButton={menubar.undoButton}
+    buttonFooter={menubar.buttonFooter}
+    check={menubar.check}
+    info={menubar.info}
+
+    getActions={(action, data) => getActions(action, data)}
+ >
+    <h2>CHILDREN DATA</h2>
+</MenuBar>
+```
+
+
+
+## 2) Modal
+### Implementation
+```js
+import { Modal } from 'empower-container';
+```
+### Options
+
+    show: false,
+    hideMenuBar: false, //optional
+    
+```js
+config: {
+    title: 'Test Title',
+    icon: SVG_REQUEST,
+    showInfo: true,
+    iconType: ['standard', 'close'],
+    modalSize: 'lg'
+}
+```
+```js
+mainButton: {
+    show: true,
+    label: 'File a Request',
+    icon: SVG_ADD,
+    actions: [
+        {
+            
+            label: "File Leave",
+            action: "leave",       // string optional
+            icon: SVG_SUBMIT
+        },
+        {
+            label: "File Overtime",
+            action: "overtime",       // string optional
+            icon: SVG_SUBMIT
+        },
+
+        {
+            label: "File Toil",
+            action: "toil",       // string optional
+            icon: SVG_SUBMIT
+        },
+
+        {
+            label: "File Amendment",
+            action: "amendment",       // string optional
+            icon: SVG_SUBMIT
+        }
+    ]
+}
+```
+
+```js    
+button {
+    show: true
+    actions: [{
+        class: 'button',
+        label: "Submit",
+        action: "readytosubmit",       // string optional
+        icon: SVG_SUBMIT
+    }]
+}
+```
+```js
+buttonFooter: { 
+    show: true,
+    actions: [{
+            class: 'button',
+            label: "Submit",
+            action: "footer-submit",       // string optional
+            icon: SVG_SUBMIT,
+            show: true
+    }]
+},
+```
+```js
+pagination: {
+    show: true,
+    hideSummary: false,
+    counter: 10,
+    perPage: 10,
+    page: 1,
+    total: 35,
+}
+```
+```js
+pivot: {
+    show: true,
+    selected: 'all',
+    actions: [
+        {
+            label: "All",
+            value: "all",       // string optional
+        },
+        {
+            label: "Pending",
+            value: "pending",       // string optional
+        },
+        {
+            label: "Approved",
+            value: "approved",       // string optional
+        },
+        {
+            label: "Rejected",
+            value: "rejected",       // string optional
+        },
+        {
+            label: "Cancelled",
+            value: "cancelled",    // string optional
+        },
+    ]
+}
+```
+```js
+dropdown: {
+    show: true,
+    title: 'File Test',
+    type: 'date-picker-monthly',
+    selection: {
+        startDate: "Feb 2021",
+        endDate: "Feb 2021",
+    },
+}
+```
+```js
+search: {
+    show: true,
+    value: ''
+}
+```
+```js
+undoButton: {
+    show: false,
+    isFooter: true,
+    actions: [
+        {
+            class: 'button disabled',
+            show: true,
+            label: "Submit",
+            action: "submit",       // string optional
+            icon: SVG_SUBMIT,
+            timer: 3,
+            disabled: true
+        },
+        {
+            show: true,
+            label: "Undo Request",
+            action: "undo-request",       // string optional
+            icon: SVG_UNDO
+        },
+    ]
+}
+```
+```js
+check: {
+    disabled: false,
+    selected: 0,
+    total: 1
+}
+```
+```js
+info: 'Sample Information'
+```
+### Usage
+```html
+<Modal
+    config={menubar.config}
+    mainButton={menubar.mainButton}
+    button={menubar.button}
+    pagination={menubar.pagination}
+    pivot={menubar.pivot}
+    dropdown={menubar.dropdown}
+    search={menubar.search}
+    undoButton={menubar.undoButton}
+    buttonFooter={menubar.buttonFooter}
+    check={menubar.check}
+    info={menubar.info}
+
+    getActions={(action, data) => getActions(action, data)}
+>
+        <h2>CHILDREN DATA</h2>
+</Modal>
+```
+
+## Changelog
+* **0.1.24** - Fix close icon not appearing in info menubar
+* **0.1.22** - Added close icon on info menubar
+* **0.1.21** - Added mainbutton on modal
+* **0.1.18** - Fixed dynamic root issues
 * **0.1.17** - Fixed main button with single item issues