'use client';
import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
import React, { useState } from 'react';
import { FieldLabel } from '../../fields/FieldLabel/index.js';
import { useForm } from '../../forms/Form/context.js';
import { useTranslation } from '../../providers/Translation/index.js';
import { filterOutUploadFields } from '../../utilities/filterOutUploadFields.js';
import { ReactSelect } from '../ReactSelect/index.js';
import { reduceFieldOptions } from './reduceFieldOptions.js';
import './index.scss';
const baseClass = 'field-select';
export const FieldSelect = ({ fields, onChange, permissions })=>{
    const { t } = useTranslation();
    const { dispatchFields, getFields } = useForm();
    const [options] = useState(()=>reduceFieldOptions({
            fields: filterOutUploadFields(fields),
            formState: getFields(),
            permissions
        }));
    return /*#__PURE__*/ _jsxDEV("div", {
        className: baseClass,
        children: [
            /*#__PURE__*/ _jsxDEV(FieldLabel, {
                label: t('fields:selectFieldsToEdit')
            }, void 0, false, {
                fileName: "src/elements/FieldSelect/index.tsx",
                lineNumber: 53,
                columnNumber: 7
            }, this),
            /*#__PURE__*/ _jsxDEV(ReactSelect, {
                getOptionValue: (option)=>{
                    if (typeof option.value === 'object' && 'path' in option.value) {
                        return String(option.value.path);
                    }
                    return String(option.value);
                },
                isMulti: true,
                onChange: (selected)=>onChange({
                        dispatchFields,
                        formState: getFields(),
                        selected
                    }),
                options: options
            }, void 0, false, {
                fileName: "src/elements/FieldSelect/index.tsx",
                lineNumber: 54,
                columnNumber: 7
            }, this)
        ]
    }, void 0, true, {
        fileName: "src/elements/FieldSelect/index.tsx",
        lineNumber: 52,
        columnNumber: 5
    }, this);
};

//# sourceMappingURL=index.js.map