Proyectos de Subversion LeadersLinked - SPA

import React from 'react';

import React from 'react';

import { Controller, useFormContext } from 'react-hook-form';

import { Controller, useFormContext } from 'react-hook-form';

import { FormControl, FormLabel, Typography } from '@mui/material';

import { FormControl, FormLabel, Typography } from '@mui/material';

import { CKEditor } from '@ckeditor/ckeditor5-react';

import { CKEditor } from '@ckeditor/ckeditor5-react';

import Editor from '@components/common/ckeditor/ClassicEditor';

import Editor from '@components/common/ckeditor/ClassicEditor';

export function FormRichEditor({ label = '', name = '', disabled, rules, onReady = () => {} }) {

export function FormRichEditor({ label = '', name = '', disabled, rules, onReady = () => {} }) {

  const { control } = useFormContext();

  const { control } = useFormContext();

  return (

  return (

    <Controller

    <Controller

      name={name}

      name={name}

      control={control}

      control={control}

      disabled={disabled}

      disabled={disabled}

      rules={rules}

      rules={rules}

      render={({ field: { value, onChange, disabled }, fieldState: { error } }) => (

      render={({ field: { value, onChange, disabled }, fieldState: { error } }) => (

        <FormControl variant='standard' fullWidth>

        <FormControl variant='standard' fullWidth>

          {label && <FormLabel>{label}</FormLabel>}

          {label && <FormLabel>{label}</FormLabel>}

          <CKEditor

          <CKEditor

            editor={Editor}

            editor={Editor}

            onReady={onReady}

            onReady={onReady}

            data={value}

            data={value}

            onChange={(event, editor) => onChange(editor.getData())}

            onChange={(event, editor) => onChange(editor.getData())}

            disabled={disabled}

            disabled={disabled}

          />

          />

          {error && (

          {error && (

            <Typography sx={{ color: 'red', fontSize: '0.75rem' }}>{error.message}</Typography>

            <Typography sx={{ color: 'red', fontSize: '0.75rem' }}>{error.message}</Typography>

          )}

          )}

        </FormControl>

        </FormControl>

      )}

      )}

    />

    />

  );

  );

}

}