"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.FormItem = exports.FormItemInner = void 0;
const react_1 = __importStar(require("react"));
const inlines_1 = require("inlines");
const Label_1 = require("./Label");
const __1 = require("../..");
const __2 = require("../..");
const ObjectItem_1 = require("../ObjectItem");
// }> = ({
// item: {
// },
const FormItemInner = ({ fieldWidth = 185, width = 160, autoFocus, item: { validation, props, type, field, label, description, options, default: defaultValue, multiple, items, addMultipleLabel = 'Add', properties, meta, }, value, onChange, item, onChangeObj, objValues, hasChanges, valuesChanged, setChanges, alwaysAccept, style, }) => {
    if (!label) {
        if (meta?.label) {
            label = meta?.label;
        }
        else {
            label = (0, react_1.useMemo)(() => field[0].toUpperCase() + field.slice(1).replace('.', ' '), [field]);
        }
    }
    if (!description && meta?.description) {
        description = meta?.description;
    }
    if ((defaultValue && value === undefined) || value === '') {
        value = defaultValue;
    }
    if (multiple && !value && !defaultValue) {
        value = [''];
    }
    if (multiple || type === 'array' || type === 'set' || type === 'references') {
        return (react_1.default.createElement(inlines_1.styled.div, { style: { width: '100%', marginBottom: 16 } },
            react_1.default.createElement(__2.List, { item: item, items: items, onChangeObj: onChangeObj, onChange: onChange, field: field, label: label, type: type, value: value, hasChanges: hasChanges, valuesChanged: valuesChanged, setChanges: setChanges, alwaysAccept: alwaysAccept })));
    }
    if (item.type === 'object') {
        const parsedObjArray = [];
        if (properties) {
            for (const i in properties) {
                parsedObjArray.push({ ...properties[i], field: field + '.' + i });
            }
        }
        const objectArray = [
            ...new Set(parsedObjArray
                .map((item) => item.field.split('.')[0])
                .filter((e, i, a) => a.indexOf(e) !== i)),
        ];
        return (react_1.default.createElement(ObjectItem_1.ObjectItem, { key: objectArray[0], d: objectArray[0], autoFocus: autoFocus, onChange: onChangeObj, labelWidth: width, fieldWidth: fieldWidth, onChangeField: onChange, style: {
                width: '100%',
            }, values: objValues, hasChanges: hasChanges, valuesChanged: valuesChanged, setChanges: setChanges, alwaysAccept: alwaysAccept, parsedObjArray: parsedObjArray, field: field }));
    }
    if (item.type === 'type') {
        return '';
    }
    if (typeof type === 'function') {
        return (react_1.default.createElement(Label_1.Label, { style: {
                marginBottom: 16,
                ...style,
            }, labelWidth: width, label: label, description: description },
            react_1.default.createElement(inlines_1.styled.div, { style: { width: fieldWidth } }, react_1.default.createElement(type, {
                // @ts-ignore
                value,
                onChange,
                autoFocus,
                type,
                field,
                label,
                description,
                validation,
                options,
                defaultValue,
                ...props,
            }))));
    }
    if (options) {
        return (react_1.default.createElement(Label_1.Label, { style: {
                marginBottom: 16,
                ...style,
            }, labelWidth: width, label: label, description: description },
            react_1.default.createElement(__1.Input, { type: "select", value: value, autoFocus: autoFocus, onChange: (v) => {
                    onChange(field, v);
                }, options: options.map((value, i) => {
                    if (typeof value !== 'object') {
                        return { value: String(i), label: value };
                    }
                    return { value };
                }), ...props, 
                // @ts-ignore
                style: Object.assign({ width: fieldWidth }, props?.style) })));
    }
    if (type === 'json') {
        return (react_1.default.createElement(inlines_1.styled.div, { style: { width: '100%', marginBottom: 16 } },
            react_1.default.createElement(Label_1.Label, { labelWidth: width, label: label, description: description }),
            meta?.format === 'rich-text' ? (react_1.default.createElement(__1.Input, { defaultValue: value ?? '', type: 'rich-text', onChange: ({ json, html }) => {
                    onChange(field, json);
                    // if (meta.linkedField) {
                    onChange(meta.linkedField, html);
                    // }
                }, ...props })) : (react_1.default.createElement(__1.Code, { onChange: (v) => onChange(field, v), value: value, language: "json" })))
        // </Label>
        );
    }
    if (type === 'boolean') {
        return (react_1.default.createElement(__1.Toggle, { label: label, value: value, onChange: (v) => onChange(field, v), 
            // {...props}
            // @ts-ignore
            style: props?.style }));
    }
    if (type === 'range') {
        return (react_1.default.createElement(Label_1.Label, { style: {
                marginBottom: 16,
                ...style,
            }, labelWidth: width, label: label, description: description },
            react_1.default.createElement(__1.Row, { style: { minWidth: fieldWidth } },
                react_1.default.createElement(__1.Input, { autoFocus: autoFocus, onChange: (v) => {
                        onChange(field, {
                            min: v,
                            max: v > value?.max ? v : value?.max ?? v,
                        });
                    }, value: value?.min, type: "number", placeholder: "Min", ...props, 
                    // @ts-ignore
                    style: Object.assign({ width: (fieldWidth - 9) / 2, marginRight: 9 }, props?.style) }),
                react_1.default.createElement(__1.Input, { autoFocus: autoFocus, onChange: (v) => {
                        onChange(field, {
                            max: v,
                            min: v < value?.min ? v : value?.min ?? 0,
                        });
                    }, value: value?.max, type: "number", placeholder: "Max", ...props, 
                    // @ts-ignore
                    style: Object.assign({ width: (fieldWidth - 9) / 2 }, props?.style) }))));
    }
    if (type === 'checkbox') {
        return (react_1.default.createElement(__1.Input, { autoFocus: autoFocus, type: "checkbox", value: value, onChange: (v) => onChange(field, v), label: label, ...props, 
            // @ts-ignore
            style: Object.assign({ marginBottom: 16, marginRight: 32 }, props?.style) }));
    }
    const validateResult = validation ? validation(value) : true;
    const newRegExp = meta?.regex ? new RegExp(meta?.regex) : false;
    const isString = typeof validateResult === 'string';
    const isError = newRegExp
        ? !newRegExp.test(value)
        : isString
            ? true
            : !validateResult;
    if (type === 'file') {
        return (react_1.default.createElement(inlines_1.styled.div, { style: {
                marginBottom: 16,
                display: 'flex',
                flexDirection: 'row',
                justifyContent: 'center',
                alignItems: 'center',
                maxWidth: fieldWidth * 2,
            } },
            react_1.default.createElement(Label_1.Label, { labelWidth: width - 10, label: label, description: description }),
            react_1.default.createElement(__1.Input, { error: isError, message: isError && isString ? validateResult : undefined, autoFocus: autoFocus, 
                // value={value ?? ''}
                // @ts-ignore
                type: type, onChange: (v) => onChange(field, v), ...props, 
                // @ts-ignore
                style: Object.assign({ minWidth: fieldWidth, width: '100%' }, props?.style) })));
    }
    return (react_1.default.createElement(__1.Input, { min: meta?.minimum, max: meta?.maximum, maxLength: meta?.maxChar, disabled: meta?.readOnly, error: isError, message: isError && isString ? validateResult : undefined, autoFocus: autoFocus, value: value ?? '', 
        // @ts-ignore
        type: type === 'integer' || type === 'timestamp' || type === 'int'
            ? 'number'
            : type === 'string' ||
                type === 'id' ||
                type === 'reference' ||
                type === 'url'
                ? 'text'
                : type, onChange: (v) => onChange(field, v), ...props, 
        // @ts-ignore
        style: Object.assign({ minWidth: fieldWidth, width: '100%' }, props?.style) }));
};
exports.FormItemInner = FormItemInner;
const FormItem = (props) => {
    let { label, field, type, options, meta, description } = props.item;
    if (meta?.isLinkedField) {
        return react_1.default.createElement(react_1.default.Fragment, null);
    }
    if (!label) {
        if (meta?.label) {
            label = meta?.label;
        }
        else if (meta?.name) {
            label = meta?.name;
        }
        else {
            label = (0, react_1.useMemo)(() => field[0].toUpperCase() + field.slice(1).replace('.', ' '), [field]);
        }
    }
    if (!description && meta?.description) {
        description = meta?.description;
    }
    if (options ||
        typeof type === 'function' ||
        props.noLabel ||
        type === 'array' ||
        type === 'set' ||
        type === 'references' ||
        type === 'json' ||
        type === 'range' ||
        type === 'file')
        return (react_1.default.createElement("span", { style: {
                pointerEvents: meta?.readOnly ? 'none' : 'auto',
                opacity: meta?.readOnly ? '0.4' : '1',
            } },
            react_1.default.createElement(exports.FormItemInner, { ...props, item: { ...props.item, label, description } })));
    return (react_1.default.createElement("span", { style: {
            pointerEvents: meta?.readOnly ? 'none' : 'auto',
            opacity: meta?.readOnly ? '0.4' : '1',
        } },
        react_1.default.createElement(Label_1.Label, { description: description, label: label, style: props.style, labelWidth: props.width ?? 160 },
            react_1.default.createElement(exports.FormItemInner, { ...props }))));
};
exports.FormItem = FormItem;
//# sourceMappingURL=Item.js.map