"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.DEFAULT_STYLE = void 0;
const field_1 = require("../../../../../client/field");
const processNumberValue_1 = require("../../../../../client/processNumberValue");
exports.DEFAULT_STYLE = {
    height: '18px',
    width: '100%',
    color: 'inherit',
    backgroundColor: '#00000000',
    textAlign: 'center',
    padding: '0',
    margin: '0',
    fontSize: '12px',
    // outline: 'none',
    border: 'none',
    borderRadius: '0',
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
};
class Slider extends field_1.Field {
    constructor($props, $system) {
        super($props, $system, $system.api.document.createElement('input'), {
            valueKey: 'value',
            defaultValue: '0',
            defaultStyle: exports.DEFAULT_STYLE,
            processValue: processNumberValue_1.processNumberValue,
        });
        const { min = 0, max = 100 } = $props;
        this.$element.type = 'range';
        this.$element.min = `${min}`;
        this.$element.max = `${max}`;
    }
    onPropChanged(prop, current) {
        if (prop === 'min') {
            this.$element.min = `${current}`;
        }
        else if (prop === 'max') {
            this.$element.max = `${current}`;
        }
        else {
            super.onPropChanged(prop, current);
        }
    }
}
exports.default = Slider;
//# sourceMappingURL=Component.js.map