application/metaproperties/secure-text-meta-property.js

import React from 'react';
import TextField from 'material-ui/TextField';
import shallowCompare from 'react-addons-shallow-compare';

class SecuretextMetaProperty extends React.Component {
    constructor(props) {
        super(props);
        this.displayName = 'SecuretextMetaProperty';
    }

    shouldComponentUpdate(nextProps, nextState) {
        if (nextProps.value != this.props.value) {
            return true;
        }
        if (nextProps.disabled != this.props.disabled) {
            return true;
        }
        return false;
    }

    rando() {
        const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

        let str = [];
        for (let i=0; i<5; i++) {
            str.push(chars.charAt(Math.floor(Math.random() * chars.length)));
        }

        return str.join('');
    }

    render() {
        const name = this.props.name ? this.props.name : 'textfield_' + this.rando();
        const type = (this.props.value.length && this.props.value.indexOf('phc:') !== -1) ? 'password' : 'text';

        return (
            <TextField name={name} {...this.props} type={type}/>
        );
    }
}

export default SecuretextMetaProperty;