empower-container 0.1.11 → 0.1.14

package/src/main/Modal.js

@@ -1,24 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_dom_1 = __importDefault(require("react-dom"));
-var MenuBar_1 = __importDefault(require("./MenuBar"));
-require("../scss/style.scss");
-var Modal = function (_a) {
-    var id = _a.id, show = _a.show, hideMenuBar = _a.hideMenuBar, config = _a.config, getActions = _a.getActions, children = _a.children, button = _a.button, dropdown = _a.dropdown, search = _a.search, pagination = _a.pagination, pivot = _a.pivot, check = _a.check, toggle = _a.toggle, undoButton = _a.undoButton, mainButton = _a.mainButton, buttonFooter = _a.buttonFooter, info = _a.info, customClass = _a.customClass;
-    var sendActions = function (actions, data) {
-        returnValues(actions, data);
-    };
-    var returnValues = function (action, data, addedParam) {
-        if (addedParam === void 0) { addedParam = null; }
-        return getActions ? getActions(action, data, addedParam) : false;
-    };
-    return (show ? react_dom_1.default.createPortal(react_1.default.createElement("div", { className: "em-modal " + customClass },
-        react_1.default.createElement("div", { className: "em-modal-container", "data-testid": id ? id : 'default-modal-test' },
-            react_1.default.createElement("div", { className: "em-card card-modal modal-".concat(config.modalSize ? config.modalSize : 'md') }, !hideMenuBar ? (react_1.default.createElement(MenuBar_1.default, { config: config, button: button, pagination: pagination, pivot: pivot, dropdown: dropdown, search: search, toggle: toggle, undoButton: undoButton, buttonFooter: buttonFooter, check: check, info: info, getActions: function (actions, data) { return sendActions(actions, data); } },
-                react_1.default.createElement("div", { className: "em-card-content" }, children))) : react_1.default.createElement("div", { className: "em-card-content card-content" }, children)))), document.getElementById('root')) : null);
-};
-exports.default = Modal;

package/src/main/Modal.tsx

@@ -1,83 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom";
-import MenuBar from "./MenuBar";
-import '../scss/style.scss';
-
-
-interface IModalProps {
-    id?:string,
-    show: boolean,
-    hideMenuBar?:boolean,
-    config: {
-      title: string,
-      icon: any,
-      showInfo: boolean,
-      iconType: Array<string>,
-      modalSize:string
-    },
-    getActions:any
-    children?: 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,
-    info?:any,
-    customClass?: string,
-   
-}
-
-
-
-const Modal: React.FunctionComponent<IModalProps> = ({id, show,hideMenuBar, config, getActions, children, button, dropdown, search, pagination, pivot, check,toggle, undoButton, mainButton, buttonFooter, info, customClass  }) => {
-    const sendActions = (actions:string,data:string) => {
-        returnValues(actions,data)
-    }
-
-    let returnValues = (action:string, data:string, addedParam:any = null) => {
-        return getActions ? getActions(action, data, addedParam) : false;
-    }
-
-    return (
-        show ? ReactDOM.createPortal(
-            <div className={"em-modal "+ customClass }>
-                <div className="em-modal-container" data-testid={id ? id : 'default-modal-test'}>
-                     <div className={`em-card card-modal modal-${config.modalSize ? config.modalSize :   'md'}`}>
-                        {
-                            !hideMenuBar ? (
-                                <MenuBar 
-                                    config={config}
-                                    button={button}
-                                    pagination={pagination}
-                                    pivot={pivot}
-                                    dropdown={dropdown}
-                                    search={search}
-                                    toggle={toggle}
-                                    undoButton={undoButton}
-                                    buttonFooter={buttonFooter}
-                                    check={check}
-                                    info={info}
-                                    getActions={(actions:any,data:any) => sendActions(actions,data)}
-                                >
-                                    <div className="em-card-content">{ children }</div>
-                                </MenuBar>
-                            ) : <div className="em-card-content card-content">{ children }</div>
-                        }
-                    </div>
-                </div>
-            </div>,
-            document.getElementById('root')!
-        ) : null
-    )
-}
-
-export default Modal;

package/src/main/inputs/Input.tsx

@@ -1,193 +0,0 @@
-import React, { Fragment } from "react";
-import '../../scss/style.scss';
-
-
-interface IProps {
-    config: {
-        id: string | keyof Object,
-        type: string,
-        value: string | number,
-        placeholder?: string,
-        label?: string,
-        maxLength?: number,
-        readOnly?: boolean,
-        disabled?: boolean,
-       
-
-    },
-    allowedChar?: {
-        alphabet?: boolean,
-        numeric?: boolean,
-        space?: boolean,
-        allowedSymbols?: Array<string>
-    },
-    customClass?: string
-    onChanged?: (event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLDivElement, MouseEvent>, data?:string) => void,
-    keyPressed?: (event: React.KeyboardEvent<HTMLInputElement> | React.MouseEvent<HTMLDivElement, MouseEvent>) => void
-
-    
-}
-
-
-const sanitizeValue = (txt: string, props: IProps['allowedChar']) => {
-    let pattern = null;
-    let newTxt = txt;
-
-    if (props && props.constructor === Object) {
-        if (props.allowedSymbols && props.allowedSymbols.constructor === Array && props.allowedSymbols.length > 0) {
-            pattern = `^a-zA-Z0-9`
-            pattern = new RegExp(`[${pattern}${props.allowedSymbols.join('')} ]`, 'gi')
-            newTxt = newTxt.replace(pattern, "");
-
-        } else {
-            pattern = `^a-zA-Z0-9`
-            pattern = new RegExp(`[${pattern} ]`, 'gi')
-            newTxt = newTxt.replace(pattern, "");
-
-        }
-
-        if (props.alphabet === false) {
-            pattern = /[a-z]/gi
-            newTxt = newTxt.replace(pattern, "");
-
-        }
-
-        if (props.numeric === false) {
-            pattern = /[0-9]+$/gi
-            newTxt = newTxt.replace(pattern, "");
-
-        }
-
-        if (props.space === false) {
-            pattern = /\s/gi
-            newTxt = newTxt.replace(pattern, "");
-
-        }
-
-    }
-    return newTxt;
-
-}
-
-const Input: React.FC<IProps> = ({ config, allowedChar, customClass, onChanged, keyPressed }) => {
-
-    customClass = customClass ? customClass : ''
-
-
-    let allowedTypes = [
-        'text', 'number', 'password', 'submit', 'reset', 'radio', 'checkbox', 'button',
-        'file', 'image', 'color', 'date', 'datetime-local', 'email', 'month', 'url', 'week',
-        'search', 'tel']
-
-
-
-    /**
-    * onChangeHandler
-    * get the current value from the input field
-    * @param {*} event - event which will be used to get the changed value
-    */
-    let onChangeHandler = (event: React.ChangeEvent<HTMLInputElement>) => {
-
-        if (config.type === 'text' && allowedChar && allowedChar.constructor === Object && Object.keys(allowedChar).length > 0) {
-            event.target.value = sanitizeValue(event.target.value, allowedChar);
-        }
-
-        if (onChanged) {
-            if (event.target.value && config.maxLength) {
-
-                if (event.target.value.toString().length <= config.maxLength) {
-                    return onChanged(event);
-                }
-            } else {
-                return onChanged(event);
-            }
-        } else {
-            console.error("No onChanged property");
-        }
-    }
-
-    /**
-   * onKeypressHandler
-   * get the current value from the input field
-   * @param {*} event - event which will be used to get the changed value
-   */
-    let onKeypressHandler = (event: React.KeyboardEvent<HTMLInputElement>) => {
-        if (event.key === 'Enter') {
-            if (keyPressed) {
-                return keyPressed(event);
-            }
-        }
-    }
-
-    /**
-    * clearValuesHandler
-    * reset value into null and return it to parent
-    * @param {*} event - event
-    */
-    let clearValuesHandler = (event: React.MouseEvent<HTMLDivElement>): any => {
-       
-        if (event) {
-            event.preventDefault();
-            return null;
-        }
-
-    }
-
-
-
-
-
-    return (
-        <div className={"em-input " + customClass  }>
-            {
-                config.type === 'time' ? (
-                    <div className={'e-input e-input-time ' + (config.disabled ? 'input-disabled' : "")} data-testid="component-input">
-                        <input
-                            {...config}
-                            onChange={onChangeHandler}
-                        />
-                        {
-                            config.disabled || !config.value ? null : (
-                                <div className='e-input-icon' onClick={clearValuesHandler}>
-                                    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-                                        <path fillRule="evenodd" clipRule="evenodd" d="M3.00005 14.7895L5.21058 17L10 12.2106L14.7895 17.0001L17 14.7895L12.2105 10.0001L17.0001 5.21053L14.7895 3L10 7.78953L5.21053 3.00005L3 5.21058L7.78948 10.0001L3.00005 14.7895Z" fill="#A0AEC0" />
-                                    </svg>
-                                </div>
-                            )
-
-
-                        }
-                    </div>
-                ) : allowedTypes.includes(config.type) ? config.label && config.label !== '' ?
-                    (
-                        <Fragment>
-
-                            <label>{config.label}</label>
-                            <input data-testid="component-input" {...config}
-                                onChange={event => onChangeHandler(event)}
-                                onKeyPress={event => onKeypressHandler(event)}
-                            />
-                        </Fragment>
-                    )
-                    :
-                    (
-                        <Fragment>
-
-                            <input
-                                {...config}
-                                className="em-input-field"
-                                data-testid="component-input"
-                                onChange={event => onChangeHandler(event)}
-                                onKeyPress={event => onKeypressHandler(event)}
-                            />
-
-                        </Fragment>
-                    )
-                        : null
-            }
-        </div>
-    );
-
-}
-
-export default Input;

package/src/main/inputs/InputSelectionHandler.tsx

@@ -1,21 +0,0 @@
-import React from 'react';
-import Input from './Input';
-import Select from './Select';
-
-const InputSelectionHandler = (props:any) => {
-    switch (props.config.type) {
-        case "text":
-        case "number":
-        case "time":
-        case "password":
-            return <Input  {...props} />;
-        case "select":
-        case "multi-select":
-            return <Select {...props} />;
-        case "toggle-button":
-        default:
-            console.error("Invalid Input Type");
-            return null;
-    }
-}
-export default InputSelectionHandler;