@mikezimm/fps-library-v2/lib/components/molecules/ReactListV1/atoms/detailsList.js

Library of reusable typescript/javascript functions, interfaces and constants

import * as React from 'react';
export const autoDetailsList = (item, highlightKeys, specialKeys, showOthers) => {
    //Build Highlighted Props:
    let hoverWebStyle = { fontWeight: 700 };
    let showTheseProps = [];
    let missingProp = "Error:  prop not available";
    if (highlightKeys.length > 0) {
        showTheseProps.push(React.createElement("div", null,
            React.createElement("h2", null, "Highligted Props")));
    }
    highlightKeys.map(prop => {
        if (prop === 'refElement') {
            showTheseProps.push(item[prop]);
        }
        else {
            let propType = typeof item[prop];
            let propVal = propType === 'object' || propType === 'boolean' ? JSON.stringify(item[prop]) : item[prop];
            if (propVal === undefined) {
                propVal = missingProp;
            }
            showTheseProps.push(React.createElement("p", null,
                React.createElement("span", { style: hoverWebStyle },
                    prop,
                    ":"),
                " ",
                propVal));
        }
    });
    //console.log('spespecialKeys', specialKeys);
    //showTheseProps.push( <div><ColoredLine color='black' height='1px'></ColoredLine></div> );
    if (specialKeys.length > 0) {
        showTheseProps.push(React.createElement("div", null,
            React.createElement("h2", null, "Special Props")));
    }
    specialKeys.map(prop => {
        if (prop === 'refElement') {
            showTheseProps.push(item[prop]);
        }
        else {
            let propType = typeof item[prop];
            let propVal = propType === 'object' || propType === 'boolean' ? JSON.stringify(item[prop]) : item[prop];
            if (propVal === undefined) {
                propVal = missingProp;
            }
            showTheseProps.push(React.createElement("p", null,
                React.createElement("span", { style: hoverWebStyle },
                    prop,
                    ":"),
                " ",
                propVal));
        }
    });
    if (showOthers) {
        showTheseProps.push(React.createElement("div", null,
            React.createElement("h2", null, "Other Props")));
        let hoverMinorPropStyle = { fontSize: 'smaller', fontWeight: 700 };
        Object.keys(item).map(prop => {
            if (prop === 'refElement') {
                showTheseProps.push(item[prop]);
            }
            else if (highlightKeys.indexOf(prop) < 0 && specialKeys.indexOf(prop) < 0) {
                let propType = typeof item[prop];
                let propVal = propType === 'object' || propType === 'boolean' ? JSON.stringify(item[prop]) : item[prop];
                if (propVal === undefined) {
                    propVal = missingProp;
                }
                showTheseProps.push(React.createElement("p", null,
                    React.createElement("span", { style: hoverMinorPropStyle },
                        prop,
                        ":"),
                    " ",
                    propVal));
            }
        });
    }
    return showTheseProps;
};
//# sourceMappingURL=detailsList.js.map