empower-container 0.1.5 → 0.1.8

package/README.md

@@ -7,7 +7,7 @@
 ## 1) Menubar
 ###  Implementation
 ```js
-import { MenuBar } from 'empoower-container';
+import { MenuBar } from 'empower-container';
 ```
 ### Options
 
@@ -156,7 +156,7 @@ info: 'Sample Information'
 ## 2) Modal
 ### Implementation
 ```js
-import { Modal } from 'empoower-container';
+import { Modal } from 'empower-container';
 ```
 ### Options
 

package/dist/cjs/DatetimeFormatter.d.ts

@@ -0,0 +1,3 @@
+export declare const getUTCFullTime: (d: any) => string;
+declare const datetimeFormatter: (timestamp: string | Date | any, format?: string, todayServer?: any, type?: any, getServerTime?: boolean, dateOnly?: boolean) => any;
+export default datetimeFormatter;

package/dist/cjs/DatetimeFormatter.js

@@ -0,0 +1,389 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getUTCFullTime = void 0;
+/* eslint-disable no-useless-concat */
+var daysWeekNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+var daysWeekNamesFull = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Sat'];
+var monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+var monthNamesFull = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
+var addZero = function (i) {
+    var num;
+    if (i < 10) {
+        num = "0" + i;
+    }
+    return num;
+};
+var getUTCFullTime = function (d) {
+    if (Object.prototype.toString.call(d) === '[object Date]') {
+        var h = addZero(d.getUTCHours());
+        var m = addZero(d.getUTCMinutes());
+        var s = addZero(d.getUTCSeconds());
+        return h + ":" + m + ":" + s;
+    }
+    else {
+        return '';
+    }
+};
+exports.getUTCFullTime = getUTCFullTime;
+var datetimeFormatter = function (timestamp, format, todayServer, type, getServerTime, dateOnly) {
+    if (format === void 0) { format = "datetime"; }
+    if (todayServer === void 0) { todayServer = null; }
+    if (type === void 0) { type = null; }
+    if (getServerTime === void 0) { getServerTime = false; }
+    if (dateOnly === void 0) { dateOnly = false; }
+    try {
+        var iosDate = void 0;
+        if (timestamp && (timestamp.constructor === String || timestamp.constructor === Date || (timestamp.constructor === Object && timestamp.dateTimeStamp))) {
+            var date = null;
+            var arrayDate = [];
+            todayServer = todayServer && todayServer.constructor === String ? todayServer.replace('+00', '') : null;
+            if (type === 'time') {
+                timestamp = '2021-01-01 ' + timestamp; //add date when the passed timestamp is time only and the desired format is time (use to fix NaN return)
+            }
+            if (timestamp === "today") {
+                date = new Date();
+            }
+            else {
+                if (timestamp && timestamp.constructor === String) {
+                    timestamp = timestamp.replace('+00', ''); //removing unnecessary gmt from backend as the time is already in ph
+                    arrayDate = timestamp.split(/[- :.]/);
+                }
+                else if (timestamp.constructor === Object && timestamp.dateTimeStamp && timestamp.source && timestamp.source === "v3") {
+                    // this will be used if the datetime from api is set to UTC already
+                    timestamp = timestamp.dateTimeStamp; //removing unnecessary gmt from backend as the time is already in ph
+                    arrayDate = timestamp.split(/[- :.]/);
+                }
+                if (arrayDate.length === 3) {
+                    iosDate = new Date(arrayDate[0], arrayDate[1] - 1, arrayDate[2], arrayDate[3]);
+                }
+                else if (arrayDate.length >= 5 && arrayDate.length <= 8) {
+                    iosDate = new Date(arrayDate[0], arrayDate[1] - 1, arrayDate[2], arrayDate[3], arrayDate[4], arrayDate[5]);
+                }
+                else if (arrayDate.length >= 9) {
+                    // new implementation for safari and for the node datetime
+                    iosDate = new Date(arrayDate[0] + " " + arrayDate[1] + " " + arrayDate[2] + " " + arrayDate[3] + " " + arrayDate[4] + ":" + arrayDate[5] + ":" + arrayDate[6] + " GMT");
+                }
+                else {
+                    iosDate = new Date(timestamp);
+                }
+                //checking if the function used the getServerTime
+                if (getServerTime) {
+                    date = new Date(timestamp);
+                }
+                else {
+                    if (dateOnly) {
+                        date = new Date(timestamp).toLocaleString('en-US', { timeZone: 'GMT' }); //making the date picked as the default gmt so that the new date wont adjust by timezone
+                        date = new Date(date);
+                    }
+                    else {
+                        var currentTz = Intl.DateTimeFormat().resolvedOptions().timeZone;
+                        date = new Date(timestamp).toLocaleString('en-US', { timeZone: currentTz }); //making the date picked as the default gmt so that the new date wont adjust by timezone
+                        date = new Date(date);
+                    }
+                }
+                // for firefox
+                if (date) {
+                    var splitTimeStampBySpace = timestamp.split(' ');
+                    if (splitTimeStampBySpace.length === 2) {
+                        if (isNaN(parseInt(splitTimeStampBySpace[0])) && splitTimeStampBySpace[1]) {
+                            date = new Date("".concat(splitTimeStampBySpace[0], " 01, ").concat(splitTimeStampBySpace[1]));
+                        }
+                    }
+                }
+            }
+            if ((date && date.toString() !== 'Invalid Date') || (iosDate && iosDate.toString() !== 'Invalid Date')) {
+                //get DATE
+                var dayName = daysWeekNames[isNaN(date.getDay()) ? iosDate.getDay() : date.getDay()];
+                var dayNameFull = daysWeekNamesFull[isNaN(date.getDay()) ? iosDate.getDay() : date.getDay()];
+                var dayDate = ("0" + (isNaN(date.getDate()) ? iosDate.getDate() : date.getDate())).slice(-2);
+                var monthName = monthNames[isNaN(date.getMonth()) ? iosDate.getMonth() : date.getMonth()];
+                var monthNameFull = monthNamesFull[isNaN(date.getMonth()) ? iosDate.getMonth() : date.getMonth()];
+                var year = isNaN(date.getFullYear()) ? iosDate.getFullYear() : date.getFullYear();
+                var MonthNumeric = ("0" + (isNaN(date.getMonth()) ? (iosDate.getMonth() + 1) : (date.getMonth() + 1))).slice(-2);
+                var firstDay = new Date(year, isNaN(date.getMonth()) ? iosDate.getMonth() : date.getMonth(), 1);
+                var lastDay = new Date(year, (isNaN(date.getMonth()) ? iosDate.getMonth() : date.getMonth()) + 1, 0);
+                var monthFirstDay = ("0" + firstDay.getDate()).slice(-2);
+                var monthLastDay = ("0" + lastDay.getDate()).slice(-2);
+                //get TIME
+                var hours = isNaN(date.getHours()) ? iosDate.getHours() : date.getHours();
+                var minutes = isNaN(date.getMinutes()) ? iosDate.getMinutes() : date.getMinutes();
+                var seconds = isNaN(date.getSeconds()) ? iosDate.getSeconds() : date.getSeconds();
+                var ampm = hours >= 12 ? 'PM' : 'AM';
+                hours = hours % 12;
+                hours = hours ? hours : 12; // the hour '0' should be '12'
+                minutes = minutes < 10 ? '0' + minutes : minutes;
+                seconds = seconds < 10 ? '0' + seconds : seconds;
+                var strTime = hours + ':' + minutes + ' ' + ampm;
+                var today = new Date();
+                if (todayServer !== null) {
+                    today = new Date(todayServer);
+                }
+                var todayTS = Math.round((today).getTime() / 1000);
+                var dateTS = Math.round((date).getTime() / 1000);
+                var newFormat = null;
+                switch (format) {
+                    case "datetime":
+                        // Mon, 01 Jan 2020 at 12:00PM
+                        newFormat = dayName + ", " + dayDate + " " + monthName + " " + year + " at " + strTime;
+                        break;
+                    case "datetime-no-day":
+                        // 01 Jan 2020 at 12:00PM
+                        newFormat = dayDate + " " + monthName + " " + year + " at " + strTime;
+                        break;
+                    case "date":
+                        // Mon, 01 Jan 2020
+                        newFormat = dayName + ", " + dayDate + " " + monthName + " " + year;
+                        break;
+                    case "momentsAgo":
+                        var diff = 0;
+                        var diffMinute = 0;
+                        if (todayTS >= dateTS) {
+                            //check if 24hours has been passed
+                            if (todayTS >= (dateTS + 86400)) {
+                                newFormat = dayName + ", " + dayDate + " " + monthName + " " + year + " at " + strTime;
+                            }
+                            else {
+                                //check if hour has been passed
+                                if (todayTS >= dateTS + 3600) {
+                                    diff = todayTS - dateTS;
+                                    if (diff === 0) {
+                                        newFormat = "An hour ago";
+                                    }
+                                    var diffHour_1 = diff / 3600;
+                                    diffHour_1 = ~~diffHour_1;
+                                    newFormat = diffHour_1 === 1 ? "An hour ago" : diffHour_1 + " hours ago";
+                                }
+                                else {
+                                    //check if a minute has been passed
+                                    if (todayTS >= dateTS + 60) {
+                                        diff = todayTS - dateTS;
+                                        if (diff === 0) {
+                                            newFormat = "A minute ago";
+                                        }
+                                        diffMinute = diff / 60;
+                                        diffMinute = ~~diffMinute;
+                                        newFormat = diffMinute === 1 ? "A minute ago" : diffMinute + " minutes ago";
+                                    }
+                                    else {
+                                        var diff_1 = todayTS - dateTS;
+                                        if (diff_1 === 0 || diff_1 <= 10) {
+                                            newFormat = "Few seconds ago";
+                                        }
+                                        else {
+                                            newFormat = "Few seconds ago";
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                        else {
+                            newFormat = dayName + ", " + dayDate + " " + monthName + " " + year + " at " + strTime;
+                        }
+                        break;
+                    case "momentsAgoConvo":
+                        var diffHour = 0;
+                        if (todayTS >= dateTS) {
+                            //check if 24hours has been passed
+                            if (todayTS >= (dateTS + 86400)) {
+                                newFormat = dayName + ", " + dayDate + " " + monthName + " " + year + " at " + strTime + " (PH)";
+                            }
+                            else {
+                                //check if hour has been passed
+                                if (todayTS >= dateTS + 3600) {
+                                    var diff_2 = todayTS - dateTS;
+                                    if (diff_2 === 0) {
+                                        newFormat = "An hour ago";
+                                    }
+                                    diffHour = diff_2 / 3600;
+                                    diffHour = ~~diffHour;
+                                    newFormat = diffHour === 1 ? "An hour ago" : diffHour + " hours ago";
+                                }
+                                else {
+                                    //check if a minute has been passed
+                                    if (todayTS >= dateTS + 60) {
+                                        var diff_3 = todayTS - dateTS;
+                                        if (diff_3 === 0) {
+                                            newFormat = "A minute ago";
+                                        }
+                                        var diffMinute_1 = diff_3 / 60;
+                                        diffMinute_1 = ~~diffMinute_1;
+                                        newFormat = diffMinute_1 === 1 ? "A minute ago" : diffMinute_1 + " minutes ago";
+                                    }
+                                    else {
+                                        var diff_4 = todayTS - dateTS;
+                                        if (diff_4 === 0 || diff_4 <= 10) {
+                                            newFormat = "Few moments ago";
+                                        }
+                                        else {
+                                            newFormat = "Few seconds ago";
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                        else {
+                            //Mon, 01 Jan 2020 (PH)
+                            newFormat = dayName + ", " + dayDate + " " + monthName + " " + year + " at " + strTime + " (PH)";
+                        }
+                        break;
+                    case "momentsAgoClimax":
+                        if (todayTS >= dateTS) {
+                            //check if 24hours has been passed
+                            if (todayTS >= (dateTS + 86400)) {
+                                var diff_5 = todayTS - dateTS;
+                                if (diff_5 === 0) {
+                                    newFormat = "1 day";
+                                }
+                                var diffDay = diff_5 / 86400;
+                                diffDay = ~~diffDay;
+                                newFormat = diffDay === 1 ? "1 day" : diffDay + " days";
+                            }
+                            else {
+                                newFormat = "0 day";
+                            }
+                        }
+                        else {
+                            newFormat = "0 day";
+                        }
+                        break;
+                    case "inquiry-date-standard":
+                        newFormat = dayDate + " " + monthName + " " + year;
+                        //10 Feb 2021
+                        break;
+                    case "date-standard":
+                        newFormat = year + "-" + MonthNumeric + "-" + dayDate;
+                        //2021-02-10
+                        break;
+                    case "datetime-standard":
+                        newFormat = year + "-" + MonthNumeric + "-" + dayDate + ' ' + date.getHours() + ':' + date.getMinutes();
+                        //2021-02-10 15:49
+                        break;
+                    case "start-of-Week":
+                        //calculating the first day of the week
+                        var startWeekD = new Date(date);
+                        var startWeekDay = startWeekD.getDay(), startWeekDiff = startWeekD.getDate() - startWeekDay;
+                        var startWeekDayNewDate = new Date(startWeekD.setDate(startWeekDiff));
+                        var startWeekMonthName = monthNames[startWeekDayNewDate.getMonth()];
+                        var startWeekDayDate = ("0" + startWeekDayNewDate.getDate()).slice(-2);
+                        var startWeekYear = startWeekDayNewDate.getFullYear();
+                        newFormat = startWeekMonthName + " " + startWeekDayDate + ", " + startWeekYear;
+                        //Feb 07, 2021
+                        break;
+                    case "end-of-Week":
+                        var endWeekD = new Date(date);
+                        var endWeekDay = endWeekD.getDay(), endWeekDiff = endWeekD.getDate() - endWeekDay + 6;
+                        var endWeekDayNewDate = new Date(endWeekD.setDate(endWeekDiff));
+                        var endWeekMonthName = monthNames[endWeekDayNewDate.getMonth()];
+                        var endWeekDayDate = ("0" + endWeekDayNewDate.getDate()).slice(-2);
+                        var endWeekYear = endWeekDayNewDate.getFullYear();
+                        newFormat = endWeekMonthName + " " + endWeekDayDate + ", " + endWeekYear;
+                        //Feb 13, 2021
+                        break;
+                    case "full-year":
+                        newFormat = year;
+                        //2021
+                        break;
+                    case "full-month":
+                        newFormat = monthNameFull;
+                        //February
+                        break;
+                    case "month-year":
+                        newFormat = monthName.substring(0, 3) + " " + year;
+                        //Feb 2021
+                        break;
+                    case "full-month-year":
+                        newFormat = monthNameFull + " " + year;
+                        //February 2021
+                        break;
+                    case "datetime-format-forPosting":
+                        var forPostingDay = String(date.getUTCDate());
+                        if (forPostingDay.length === 1) {
+                            forPostingDay = "0" + forPostingDay;
+                        }
+                        newFormat = date.getUTCFullYear() + '-' + addZero(date.getUTCMonth() + 1) + '-' + forPostingDay + 'T' + (0, exports.getUTCFullTime)(date) + 'Z';
+                        //2021-02-10T07:57:05Z
+                        break;
+                    case "month-day-year":
+                        newFormat = monthNameFull + " " + dayDate + ", " + year;
+                        //February 10, 2021
+                        break;
+                    case "time":
+                        newFormat = strTime;
+                        //3:58 PM
+                        break;
+                    case "month-numeric":
+                        newFormat = addZero(date.getUTCMonth() + 1);
+                        //02
+                        break;
+                    case "month-shortName":
+                        newFormat = monthName.substring(0, 3);
+                        //Feb
+                        break;
+                    case "day-numeric":
+                        newFormat = date.getUTCDate();
+                        //10
+                        break;
+                    case "day-calendar":
+                        newFormat = dayDate;
+                        //10
+                        break;
+                    case "month-first-date":
+                        newFormat = year + "-" + MonthNumeric + "-" + monthFirstDay;
+                        break;
+                    case "month-last-date":
+                        newFormat = year + "-" + MonthNumeric + "-" + monthLastDay;
+                        break;
+                    case "day-name":
+                        newFormat = dayName;
+                        break;
+                    case "day-name-full":
+                        newFormat = dayNameFull;
+                        break;
+                    case 'month-day':
+                        newFormat = MonthNumeric + '-' + dayDate;
+                        break;
+                    case 'date-without-year':
+                        newFormat = dayName + ", " + monthName + " " + dayDate;
+                        break;
+                    case "time-standard":
+                        var h = isNaN(date.getHours()) ? iosDate.getHours() : date.getHours();
+                        var hour = h < 10 ? '0' + h : h;
+                        newFormat = hour + ':' + minutes;
+                        // 15:30
+                        break;
+                    case 'notif-date':
+                        // 01-Jan-2020
+                        newFormat = dayDate + "-" + monthName + "-" + year;
+                        break;
+                    case 'year-month':
+                        newFormat = year + "-" + MonthNumeric;
+                        break;
+                    case "datetime-utc":
+                        newFormat = year + "-" + MonthNumeric + "-" + dayDate + ' 00:00:00+00';
+                        //2021-02-10 00:00:00+00
+                        break;
+                    case 'datetime-file-format':
+                        hours = isNaN(date.getHours()) ? iosDate.getHours() : date.getHours();
+                        hours = hours < 10 ? '0' + hours : hours;
+                        newFormat = year + "-" + "".concat(MonthNumeric) + "".concat(date.getUTCDate()) + "".concat(hours) + "".concat(minutes) + "".concat(seconds) + "".concat('1');
+                        break;
+                    default:
+                        newFormat = "";
+                        break;
+                }
+                return newFormat;
+            }
+            else {
+                return "";
+            }
+        }
+        else {
+            return "";
+        }
+    }
+    catch (error) {
+        console.error(error, 'Invalid input. Please check helpers (datetimeFormatter).');
+        return "";
+    }
+};
+exports.default = datetimeFormatter;

package/dist/cjs/Information.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface IInformationProps {
+    items: any;
+    listRow: Array<string | object>;
+    desc: boolean;
+    title?: string;
+    hide: (event: React.DOMAttributes<HTMLDivElement> | React.MouseEventHandler<HTMLDivElement> | undefined | any) => void;
+}
+declare const Information: React.FunctionComponent<IInformationProps>;
+export default Information;

package/dist/cjs/Information.js

@@ -0,0 +1,62 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = __importStar(require("react"));
+var Information = function (_a) {
+    var items = _a.items, listRow = _a.listRow, desc = _a.desc, title = _a.title, hide = _a.hide;
+    var _b = (0, react_1.useState)(null), rowAnchorEl = _b[0], setRowAnchorEl = _b[1];
+    var renderHtml = function (html) {
+        return (0, jsx_runtime_1.jsx)("div", { dangerouslySetInnerHTML: { __html: html } });
+    };
+    var showRowDetails = function (e, idx) {
+        e && e.preventDefault();
+        if (rowAnchorEl === idx) {
+            rowAnchorEl = null;
+        }
+        else {
+            rowAnchorEl = idx;
+        }
+        setRowAnchorEl(rowAnchorEl);
+    };
+    var View = function () {
+        return (0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "em-popover-i" }, { children: typeof desc != 'undefined' && desc ? ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "em-popover-i-content" }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "em-popover-i-title" }, { children: [(0, jsx_runtime_1.jsx)("h6", { children: title }), (0, jsx_runtime_1.jsx)("div", { className: "em-popover-i-close", onClick: hide })] })), (0, jsx_runtime_1.jsx)("div", { children: typeof items != 'undefined' && items ? renderHtml(items) : '' })] }))) : ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "em-popover-i-content" }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "em-popover-i-title" }, { children: [(0, jsx_runtime_1.jsx)("h6", { children: title }), (0, jsx_runtime_1.jsx)("div", { className: "em-popover-i-close", onClick: hide })] })), listRow ? (listRow.length >= 1 ? (listRow.map(function (item, key) { return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "em-popover-i-category", onClick: function (event) { return showRowDetails(event, key); } }, { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("h6", { children: item }) }), rowAnchorEl === key ? ((0, jsx_runtime_1.jsx)("img", { src: "/images/icons/icon-arrowup-gray.svg", alt: "" })) : ((0, jsx_runtime_1.jsx)("img", { src: "/images/icons/icon-arrowdown-gray.svg", alt: "" }))] })), rowAnchorEl === key ? ((0, jsx_runtime_1.jsx)("div", __assign({ className: "em-popover-i-details" }, { children: item === 'COMPANY POLICY' ? (typeof items != 'undefined' && typeof items.companyPolicy != 'undefined' && items.companyPolicy ? renderHtml(items.companyPolicy) : '') :
+                                        (item === 'SYSTEM POLICY' ? (typeof items != 'undefined' && typeof items.systemPolicy != 'undefined' && items.systemPolicy ? renderHtml(items.systemPolicy) : '') :
+                                            (typeof items != 'undefined' && typeof items.instruction != 'undefined' && items.instruction ? renderHtml(items.instruction) : '')) }))) : null] }, key)); })) : null) : null] }))) })) });
+    };
+    return View();
+};
+exports.default = Information;

package/dist/cjs/MenuBar.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+import '../scss/style.scss';
+interface IMenuBarProps {
+    config?: any;
+    info?: any;
+    button?: {
+        show: boolean;
+        actions?: Array<object>;
+    };
+    dropdown?: any;
+    search?: any;
+    pagination?: any;
+    pivot?: any;
+    check?: any;
+    toggle?: any;
+    mainButton?: any;
+    buttonFooter?: any;
+    undoButton?: any;
+    customClass?: string;
+    children: any;
+    getActions: any;
+}
+declare const MenuBar: React.FunctionComponent<IMenuBarProps>;
+export default MenuBar;