<commit_before>import React, { Component, PropTypes } from "react";

import BodyComponent from "metabase/components/BodyComponent";
import cx from "classnames";

@BodyComponent
export default class HeaderModal extends Component {
    constructor(props, context) {
        super(props, context);
        this.state = {
            initialTop: "-100%"
        };
    }

    componentDidMount() {
        this.setState({ initialTop: 0 });
    }

    render() {
        const { className, height, title, onDone, onCancel, isOpen } = this.props;
        const { initialTop } = this.state;
        return (
            <div
                className={cx(className, "absolute top left right bg-brand flex flex-column layout-centered")}
                style={{ zIndex: 2, height: height, minHeight: 50, transform: `translateY(${isOpen ? initialTop : "-100%"})`, transition: "transform 400ms ease-in-out" }}
            >
                    <h2 className="text-white pb2">{title}</h2>
                    <div className="flex layout-centered">
                        <button className="Button Button--borderless text-brand bg-white text-bold" onClick={onDone}>Done</button>
                        { onCancel && <span className="text-white mx1">or</span> }
                        { onCancel && <a className="cursor-pointer text-white text-bold" onClick={onCancel}>Cancel</a> }
                    </div>
            </div>
        );<commit_msg>prevent header modal content from showing in full screen<commit_after>import React, { Component, PropTypes } from "react";

import BodyComponent from "metabase/components/BodyComponent";
import cx from "classnames";

@BodyComponent
export default class HeaderModal extends Component {
    constructor(props, context) {
        super(props, context);
        this.state = {
            initialTop: "-100%"
        };
    }

    componentDidMount() {
        this.setState({ initialTop: 0 });
    }

    render() {
        const { className, height, title, onDone, onCancel, isOpen } = this.props;
        const { initialTop } = this.state;
        return (
            <div
                className={cx(className, "absolute top left right bg-brand flex flex-column layout-centered")}
                style={{ zIndex: 2, height: height, minHeight: 50, transform: `translateY(${isOpen ? initialTop : "-100%"})`, transition: "transform 400ms ease-in-out", overflow: 'hidden' }}
            >
                    <h2 className="text-white pb2">{title}</h2>
                    <div className="flex layout-centered">
                        <button className="Button Button--borderless text-brand bg-white text-bold" onClick={onDone}>Done</button>
                        { onCancel && <span className="text-white mx1">or</span> }
                        { onCancel && <a className="cursor-pointer text-white text-bold" onClick={onCancel}>Cancel</a> }
                    </div>
            </div>
        );
{'fraction_non_alphanumeric': 0.12708120965001699, 'fraction_numerical': 0.011552837240910635, 'mean_word_length': 2.20348204570185, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 27, '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': '4662340', 'n_tokens_mistral': 796, 'n_tokens_neox': 755, 'n_words': 200}