Dragging Custom Element inside of MultiColumn Element

[Sandlee09]

import React from 'react'; import { Registry } from '../../FormBuilderLibrary'; import { stringToHTML } from '../utils';

import TextField from '@mui/material/TextField'; import FormHelperText from '@mui/material/FormHelperText'; import { getElementIcon } from '../utils';

export const MUITextArea = React.forwardRef((props, ref) => { const { name, defaultValue, disabled, isFormBuilder } = props;

const parsedLabel = React.useMemo(() => stringToHTML(props?.data?.label), [props?.data?.label]);
const parsedHelperText = React.useMemo(
    () => stringToHTML(props?.data?.help_message),
    [props?.data?.help_message]
);

return (
    <>
        <TextField
            error={props?.data?.error}
            required={props?.data?.required}
            id="outlined-error-helper-text"
            name={name}
            inputRef={ref}
            disabled={disabled}
            defaultValue={defaultValue}
            style={{ width: '100%' }}
            label={
                <>
                    {isFormBuilder && getElementIcon(props.data?.key)}
                    {parsedLabel?.[0] ? parsedLabel : props?.data?.label}
                    {isFormBuilder && <div>{`(ff-${props.data?.unique_identifier})`}</div>}
                </>
            }
            multiline
            rows={4}
            InputLabelProps={{ shrink: isFormBuilder || undefined }}
        />
        <FormHelperText>
            {parsedHelperText?.[0] ? parsedHelperText : props?.data?.help_message}
        </FormHelperText>
    </>
);

});

MUITextArea.displayName = 'MUI_TextArea'; Registry.register('MUI_TextArea', MUITextArea);

I have a many custom elements such as this one, it works perfectly but for some reason dragging doesn't work inside of the multicolumn elements. It starts the dragpreview for less than a second and then just cancels the drag without any errors at all. Any Help, really stuck on this,

[Kiho]

You can try latest version from NPM.