<commit_before>import React from 'react';
import Modal from 'react-modal';

class Popup extends React.Component {
    render() {
        let {title, isOpen, onRequestClose, children} = this.props;
        return <Modal className="Modal__Bootstrap modal-dialog modal-lg"
                      isOpen={isOpen}
                      onRequestClose={onRequestClose}
                      style={customStyles}>
            <div>
                <div className="modal-header">
                    <button type="button" className="close" onClick={onRequestClose}>
                        <span aria-hidden="true">&times;</span>
                        <span className="sr-only">Close</span>
                    </button>
                    <h4 className="modal-title">{title}</h4>
                </div>
                <div style={childrenDivStyle}>
                    {children}
                </div>
            </div>
        </Modal>
    }
}

// this component requires react styles
const customStyles = {
    content: {
        minHeight: '450px',
    },
    overlay: {
        backgroundColor: 'rgba(0, 0, 0, 0.5)',
        //lower z index so loading spinner is visible
        zIndex: 100,
    }
};
<commit_msg>Popup.jsx should determine height from content<commit_after>import React from 'react';
import Modal from 'react-modal';

class Popup extends React.Component {
    render() {
        let {title, isOpen, onRequestClose, children} = this.props;
        return <Modal className="Modal__Bootstrap modal-dialog modal-lg"
                      isOpen={isOpen}
                      onRequestClose={onRequestClose}
                      style={customStyles}>
            <div>
                <div className="modal-header">
                    <button type="button" className="close" onClick={onRequestClose}>
                        <span aria-hidden="true">&times;</span>
                        <span className="sr-only">Close</span>
                    </button>
                    <h4 className="modal-title">{title}</h4>
                </div>
                <div style={childrenDivStyle}>
                    {children}
                </div>
            </div>
        </Modal>
    }
}

// this component requires react styles
const customStyles = {
    content: {
        minHeight: '450px',
        bottom: 'none'
    },
    overlay: {
        backgroundColor: 'rgba(0, 0, 0, 0.5)',
        //lower z index so loading spinner is visible
        zIndex: 100,
    }
};

{'fraction_non_alphanumeric': 0.11745776347546259, 'fraction_numerical': 0.010458567980691875, 'mean_word_length': 1.5825545171339563, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 35, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5502328', 'n_tokens_mistral': 670, 'n_tokens_neox': 630, 'n_words': 155}