diff --git a/src/components/RichTextEditor/BlockStyleButtons.jsx b/src/components/RichTextEditor/BlockStyleButtons.jsx
index 050614c8f..64aa846e0 100644
--- a/src/components/RichTextEditor/BlockStyleButtons.jsx
+++ b/src/components/RichTextEditor/BlockStyleButtons.jsx
@@ -17,7 +17,7 @@ const BLOCK_TYPES = [
];
const BlockStyleButtons = (props) => {
- const { editorState } = props;
+ const { editorState, disabled } = props;
const selection = editorState.getSelection();
const blockType = editorState.getCurrentContent().getBlockForKey(selection.getStartKey()).getType();
@@ -32,6 +32,7 @@ const BlockStyleButtons = (props) => {
label={type.label}
onToggle={() => onToggle(type.style)}
aria-label={type.ariaLabel}
+ disabled={disabled}
/>
));
};
diff --git a/src/components/RichTextEditor/FilePreviewList.jsx b/src/components/RichTextEditor/FilePreviewList.jsx
index 9e9557f2f..fa8b233b5 100644
--- a/src/components/RichTextEditor/FilePreviewList.jsx
+++ b/src/components/RichTextEditor/FilePreviewList.jsx
@@ -3,11 +3,11 @@ import React from 'react';
import PropTypes from 'prop-types';
import FileSticker from './FileSticker';
-const FilePreviewList = ({ files, onFileRemove }) =>
+const FilePreviewList = ({ files, onFileRemove, disabled }) =>
_.isEmpty(files) ? null : (
{_.map(files, (file, index) => (
-
+
))}
);
@@ -17,4 +17,5 @@ export default FilePreviewList;
FilePreviewList.propTypes = {
files: PropTypes.object,
onFileRemove: PropTypes.func,
+ disabled: PropTypes.bool,
};
diff --git a/src/components/RichTextEditor/FileSticker.d.ts b/src/components/RichTextEditor/FileSticker.d.ts
index 778c2910d..c2daa8172 100644
--- a/src/components/RichTextEditor/FileSticker.d.ts
+++ b/src/components/RichTextEditor/FileSticker.d.ts
@@ -10,6 +10,7 @@ export interface FileStickerFile {
export interface FileStickerProps {
file?: FileStickerFile;
onFileRemove?: (...args: any[]) => any;
+ disabled?: boolean;
}
declare const FileSticker: React.FC;
diff --git a/src/components/RichTextEditor/FileSticker.jsx b/src/components/RichTextEditor/FileSticker.jsx
index fcdb660f0..341eca304 100644
--- a/src/components/RichTextEditor/FileSticker.jsx
+++ b/src/components/RichTextEditor/FileSticker.jsx
@@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import Spinner from '../Spinner';
-const FileSticker = ({ onFileRemove, file }) => {
+const FileSticker = ({ onFileRemove, file, disabled }) => {
const [showClose, setShowClose] = React.useState(false);
const { name, path, isUploading } = file;
const isImage = /\.(jpe?g|png)$/i.test(name);
@@ -27,11 +27,12 @@ const FileSticker = ({ onFileRemove, file }) => {
)}
{showClose && (
-
)}
{isUploading && }
@@ -49,4 +50,5 @@ FileSticker.propTypes = {
isUploading: PropTypes.bool,
}),
onFileRemove: PropTypes.func,
+ disabled: PropTypes.bool,
};
diff --git a/src/components/RichTextEditor/FileUploadAction.d.ts b/src/components/RichTextEditor/FileUploadAction.d.ts
index 723db4c9f..4d1b03f6b 100644
--- a/src/components/RichTextEditor/FileUploadAction.d.ts
+++ b/src/components/RichTextEditor/FileUploadAction.d.ts
@@ -3,6 +3,7 @@ import * as React from 'react';
export interface FileUploadActionProps {
onFileUpload?: (...args: any[]) => any;
fileFilter?: string;
+ disabled?: boolean;
}
declare const FileUploadAction: React.FC;
diff --git a/src/components/RichTextEditor/FileUploadAction.jsx b/src/components/RichTextEditor/FileUploadAction.jsx
index af58957bd..49d3b9c1b 100644
--- a/src/components/RichTextEditor/FileUploadAction.jsx
+++ b/src/components/RichTextEditor/FileUploadAction.jsx
@@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import ToolbarButton from './ToolbarButton';
-const FileUploadAction = ({ onFileUpload, fileFilter }) => {
+const FileUploadAction = ({ onFileUpload, fileFilter, disabled }) => {
const fileInputRef = React.useRef();
const onFileChange = (e) => {
@@ -12,28 +12,35 @@ const FileUploadAction = ({ onFileUpload, fileFilter }) => {
return (
<>
}
+ label={}
onToggle={() => {
fileInputRef.current.value = '';
fileInputRef.current.click();
}}
- aria-label="Download file"
+ aria-label="Upload file"
+ disabled={disabled}
/>
>
);
};
-export default FileUploadAction;
+FileUploadAction.defaultProps = {
+ disabled: false,
+};
FileUploadAction.propTypes = {
onFileUpload: PropTypes.func,
fileFilter: PropTypes.string,
+ disabled: PropTypes.bool,
};
+
+export default FileUploadAction;
diff --git a/src/components/RichTextEditor/InlineStyleButtons.jsx b/src/components/RichTextEditor/InlineStyleButtons.jsx
index 4a676a96e..f0afc4405 100644
--- a/src/components/RichTextEditor/InlineStyleButtons.jsx
+++ b/src/components/RichTextEditor/InlineStyleButtons.jsx
@@ -18,6 +18,7 @@ const INLINE_STYLES = [
];
const InlineStyleButtons = (props) => {
+ const { disabled } = props;
const currentStyle = props.editorState.getCurrentInlineStyle();
const onToggle = (style) => {
@@ -31,6 +32,7 @@ const InlineStyleButtons = (props) => {
label={type.label}
onToggle={() => onToggle(type.style)}
aria-label={type.ariaLabel}
+ disabled={disabled}
/>
));
};
diff --git a/src/components/RichTextEditor/ToolbarButton.d.ts b/src/components/RichTextEditor/ToolbarButton.d.ts
index 46fa96486..f51e02132 100644
--- a/src/components/RichTextEditor/ToolbarButton.d.ts
+++ b/src/components/RichTextEditor/ToolbarButton.d.ts
@@ -4,6 +4,7 @@ export interface ToolbarButtonProps {
onToggle: (...args: any[]) => any;
label: React.ReactNode;
active?: boolean;
+ disabled?: boolean;
}
declare const ToolbarButton: React.FC;
diff --git a/src/components/RichTextEditor/ToolbarButton.jsx b/src/components/RichTextEditor/ToolbarButton.jsx
index 67031a57c..c55458165 100644
--- a/src/components/RichTextEditor/ToolbarButton.jsx
+++ b/src/components/RichTextEditor/ToolbarButton.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import classnames from 'classnames';
import Button from '../Button';
-const ToolbarButton = ({ onToggle, label, active, ...rest }) => {
+const ToolbarButton = ({ onToggle, label, active, disabled, ...rest }) => {
const className = classnames('aui--toolbar-button', {
active,
});
@@ -18,16 +18,22 @@ const ToolbarButton = ({ onToggle, label, active, ...rest }) => {
);
return (
-