import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { Field, LabelledTextInput, Form, ComponentList, } from '../../components';
import { useConfig } from '../../../../hooks';
import { TemplateField } from './template-field';
export const ActorForm = ({ path }) => {
    const { t } = useTranslation();
    const namePath = useMemo(() => path.concat('name'), [path]);
    const { templateId } = useConfig(path);
    return (_jsxs(Form, { children: [_jsx(Field, { path: namePath, component: LabelledTextInput, label: t('inspector.actorForm.field.name.label') }), templateId ? (_jsx(TemplateField, { path: path })) : null, _jsx(ComponentList, {})] }));
};
