<commit_before>import * as React from 'react';
import './styles.scss';
import { action, computed, makeObservable } from 'mobx';
import { inputBoxChangeTimeoutEvent } from '../../lib/EventUtils';

export interface IDoubleHandleSliderProps {
    id: string;
    min: string;
    max: string;
    lowerValue?: number;
    upperValue?: number;
    callbackLowerValue: (lowerValue: number) => void;
    callbackUpperValue: (upperValue: number) => void;
}

export interface IDoubleHandleSliderState {
    lowerValue: number;
    upperValue: number;
}

const WIDTH = '135px';
const PRECISION = 10;
const POWER = 10 ** PRECISION;
export default class DoubleHandleSlider extends React.Component<
    IDoubleHandleSliderProps,
    IDoubleHandleSliderState
> {
    // fixed precision number equivalent to this.props.min
    @computed get min() {
        const tmp = +(+this.props.min).toFixed(PRECISION + 1);
        return Math.floor(POWER * tmp) / POWER;
    }
    // fixed precision number equivalent to this.props.max
    @computed get max() {
        const tmp = +(+this.props.max).toFixed(PRECISION + 1);
        return Math.ceil(POWER * tmp) / POWER;
    }

    // this is used to prevent unintended changes to the handle positions
    // which may occur once a handle is released, e.g. due to table resizing
    private justReleasedHandle: boolean;

    constructor(props: IDoubleHandleSliderProps) {
        super(props);
        makeObservable(this);

        this.justReleasedHandle = false;
        this.state = {
            lowerValue: this.props.lowerValue || this.min,
            upperValue: this.props.upperValue || this.max,
        };
    }

    componentDidMount() {
        this.syncValues(true);
        this.syncValues(false);
    }
    componentDidUpdate(prevProps: IDoubleHandleSliderProps) {
        if (prevProps !== this.props) {
            this.setState({
                lowerValue: this.props.lowerValue || this.min,
                upperValue: this.props.upperValue || this.max,
            });
        } else {
            this.syncValues(true);
            this.syncValues(false);
        }
    }

    get LHId() {
        return this.props.id + ' lowerValue-handle';
    }
    get UHId() {
        return this.props.id + ' upperValue-handle';
    }
    get LBId() {
        return this.props.id + ' lowerValue-box';
    }
    get UBId() {
        return this.props.id + ' upperValue-box';
    }
    get MIDId() {
        return this.props.id + ' middleTrack';
    }
    get LH() {
        return document.getElementById(this.LHId) as HTMLInputElement;
    }
    get UH() {
        return document.getElementById(this.UHId) as HTMLInputElement;
    }
    get LB() {
        return document.getElementById(this.LBId) as HTMLInputElement;
    }
    get UB() {
        return document.getElementById(this.UBId) as HTMLInputElement;
    }<commit_msg>Remove whitespace in id of DoubleHandleSlider components<commit_after>import * as React from 'react';
import './styles.scss';
import { action, computed, makeObservable } from 'mobx';
import { inputBoxChangeTimeoutEvent } from '../../lib/EventUtils';

export interface IDoubleHandleSliderProps {
    id: string;
    min: string;
    max: string;
    lowerValue?: number;
    upperValue?: number;
    callbackLowerValue: (lowerValue: number) => void;
    callbackUpperValue: (upperValue: number) => void;
}

export interface IDoubleHandleSliderState {
    lowerValue: number;
    upperValue: number;
}

const WIDTH = '135px';
const PRECISION = 10;
const POWER = 10 ** PRECISION;
export default class DoubleHandleSlider extends React.Component<
    IDoubleHandleSliderProps,
    IDoubleHandleSliderState
> {
    // fixed precision number equivalent to this.props.min
    @computed get min() {
        const tmp = +(+this.props.min).toFixed(PRECISION + 1);
        return Math.floor(POWER * tmp) / POWER;
    }
    // fixed precision number equivalent to this.props.max
    @computed get max() {
        const tmp = +(+this.props.max).toFixed(PRECISION + 1);
        return Math.ceil(POWER * tmp) / POWER;
    }

    @computed get id() {
        return this.props.id.replace(/\s+/, '_');
    }

    // this is used to prevent unintended changes to the handle positions
    // which may occur once a handle is released, e.g. due to table resizing
    private justReleasedHandle: boolean;

    constructor(props: IDoubleHandleSliderProps) {
        super(props);
        makeObservable(this);

        this.justReleasedHandle = false;
        this.state = {
            lowerValue: this.props.lowerValue || this.min,
            upperValue: this.props.upperValue || this.max,
        };
    }

    componentDidMount() {
        this.syncValues(true);
        this.syncValues(false);
    }
    componentDidUpdate(prevProps: IDoubleHandleSliderProps) {
        if (prevProps !== this.props) {
            this.setState({
                lowerValue: this.props.lowerValue || this.min,
                upperValue: this.props.upperValue || this.max,
            });
        } else {
            this.syncValues(true);
            this.syncValues(false);
        }
    }

    get LHId() {
        return this.id + '-lowerValue-handle';
    }
    get UHId() {
        return this.id + '-upperValue-handle';
    }
    get LBId() {
        return this.id + '-lowerValue-box';
    }
    get UBId() {
        return this.id + '-upperValue-box';
    }
    get MIDId() {
        return this.id + '-middleTrack';
    }
    get LH() {
        return document.getElementById(this.LHId) as HTMLInputElement;
    }
    get UH() {
        return document.getElementById(this.UHId) as HTMLInputElement;
    }
    get LB() {
        return document.getElementById(this.LBId) as HTMLInputElement;
    }
    get UB() {
        return document.getElementById(this.UBId) as HTMLInputElement;
    }
{'fraction_non_alphanumeric': 0.11341442521843413, 'fraction_numerical': 0.0030837759122837073, 'mean_word_length': 2.4361389052383755, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 9, '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': '1371941', 'n_tokens_mistral': 1742, 'n_tokens_neox': 1698, 'n_words': 419}