import React from "react";
import { capitalize } from "lodash-es";
import { getHelpComponent } from "../help";
/**
 * A widget is a concept in react-jsonschema-form (rjsf).
 * It represents a HTML tag for the user to enter data, eg. input, select, etc.
 *
 * We use the widget adapter exclusively so we can use lime-elements instead of the
 * default input/select/checkbox/etc fields that rjsf provides.
 *
 * Please read the docs for more info.
 * Link: https://react-jsonschema-form.readthedocs.io/
 */
export class LimeElementsWidgetAdapter extends React.Component {
    constructor(props) {
        super(props);
        this.props = props;
        this.state = {
            modified: false,
        };
        this.handleChange = (event) => {
            this.props.events.change(event.nativeEvent);
        };
        this.handleBlur = this.handleBlur.bind(this);
    }
    hasValue() {
        const value = this.getValue();
        if (!value) {
            return false;
        }
        if (Array.isArray(value)) {
            return value.length > 0;
        }
        if (value instanceof Date) {
            return true;
        }
        if (typeof value === 'object') {
            return Object.entries(value).length > 0;
        }
        return true;
    }
    handleBlur() {
        this.setState({ modified: true });
    }
    getLabel() {
        const { schema, label } = this.props.widgetProps;
        return label || schema.title;
    }
    isInvalid() {
        const { modified } = this.state;
        const { rawErrors } = this.props.widgetProps;
        return (!!rawErrors && (modified || this.hasValue() || !this.isRequired()));
    }
    isRequired() {
        const { required, schema } = this.props.widgetProps;
        return required || schema.minItems > 0;
    }
    getHelperText() {
        const { rawErrors, schema } = this.props.widgetProps;
        if (!this.isInvalid()) {
            return schema.description;
        }
        if (rawErrors) {
            return capitalize(rawErrors[0]);
        }
        return schema.description;
    }
    getValue() {
        const { value } = this.props;
        const { value: widgetValue } = this.props.widgetProps;
        // Use widgetValue unless its overriden in widget
        return value || widgetValue;
    }
    render() {
        const { name, extraProps } = this.props;
        const disabled = this.isDisabled();
        const value = this.getValue();
        const readonly = this.isReadOnly();
        return React.createElement(React.Fragment, {}, React.createElement(name, Object.assign(Object.assign({ value: value, label: this.getLabel(), disabled: disabled, readonly: readonly, required: this.isRequired(), invalid: this.isInvalid(), 'helper-text': this.getHelperText() }, extraProps), { onChange: this.handleChange, onBlur: this.handleBlur })), getHelpComponent(this.props.widgetProps.schema));
    }
    isDisabled() {
        var _a, _b;
        const widgetProps = this.props.widgetProps;
        const options = widgetProps.schema.lime;
        return (widgetProps.disabled ||
            (options === null || options === void 0 ? void 0 : options.disabled) ||
            ((_b = (_a = options === null || options === void 0 ? void 0 : options.component) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.disabled));
    }
    isReadOnly() {
        const widgetProps = this.props.widgetProps;
        return widgetProps.readonly;
    }
}
