Proyectos de Subversion LeadersLinked - SPA

import React from 'react';

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

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

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

import { ClassicEditor } from 'ckeditor5';

export function FormRichEditor({

  id = '',

  label = '',

  name = '',

  disabled,

  rules,

  style = {},

  onReady = () => {}

}) {

  const { control } = useFormContext();

  return (

    <Controller

      name={name}

      control={control}

      disabled={disabled}

      rules={rules}

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

        <FormControl variant='standard' fullWidth sx={style}>

          {label && <FormLabel htmlFor={id}>{label}</FormLabel>}

          <CKEditor

            editor={ClassicEditor}

            onReady={onReady}

            data={value}

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

            id={id}

            disabled={disabled}

          />

          {error && (

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

          )}

        </FormControl>

      )}

    />

  );

}