import { jsx } from "react/jsx-runtime";
import "react";
import { isArrayField, isValid, observer, useField, useFieldSchema } from "@tachybase/schema";
import { Tag } from "antd";
import { useCollectionField } from "../../../data-source/collection-field/CollectionFieldProvider.mjs";
import { EllipsisWithTooltip } from "../input/EllipsisWithTooltip.mjs";
import { defaultFieldNames, getCurrentOptions } from "./utils.mjs";
const ReadPretty = observer((props)=>{
    var _field_value, _fieldSchema_xcomponentprops_fieldNames, _fieldSchema_xcomponentprops;
    const fieldNames = {
        ...defaultFieldNames,
        ...props.fieldNames
    };
    const field = useField();
    if (!isValid(props.value)) return /*#__PURE__*/ jsx("div", {});
    if (isArrayField(field) && (null == field ? void 0 : null == (_field_value = field.value) ? void 0 : _field_value.length) === 0) return /*#__PURE__*/ jsx("div", {});
    const collectionField = useCollectionField();
    const fieldSchema = useFieldSchema();
    const dataSource = field.dataSource || props.options || (null == collectionField ? void 0 : collectionField.uiSchema.enum) || [];
    const options = getCurrentOptions(field.value, dataSource, fieldNames);
    const currentOptions = getFormulaValue(null == (_fieldSchema_xcomponentprops = fieldSchema['x-component-props']) ? void 0 : null == (_fieldSchema_xcomponentprops_fieldNames = _fieldSchema_xcomponentprops.fieldNames) ? void 0 : _fieldSchema_xcomponentprops_fieldNames['formula'], options, fieldSchema);
    return /*#__PURE__*/ jsx("div", {
        children: /*#__PURE__*/ jsx(EllipsisWithTooltip, {
            ellipsis: props.ellipsis,
            children: currentOptions.map((option, key)=>/*#__PURE__*/ jsx(Tag, {
                    color: option[fieldNames.color],
                    icon: option.icon,
                    children: option[fieldNames.label]
                }, key))
        })
    });
}, {
    displayName: 'ReadPretty'
});
const getFormulaValue = (template, options, fieldSchema)=>{
    if (!template) return options;
    return options.map((item)=>{
        const label = item.label;
        const customLabel = template.replace(new RegExp("{{".concat(fieldSchema['name'], "}}"), 'g'), label);
        return {
            ...item,
            label: customLabel
        };
    });
};
export { ReadPretty };
