Merge remote-tracking branch 'origin/feature/rich-text-editor' into rich-text-editor/disabled

This commit is contained in:
Rémi de Juvigny 2023-09-29 11:25:06 +02:00
commit 0a68e8db1f

View File

@ -15,6 +15,12 @@ const TypographyAsterisk = styled(Typography)`
line-height: 0; line-height: 0;
`; `;
const LabelAction = styled(Box)`
svg path {
fill: ${({ theme }) => theme.colors.neutral500};
}
`;
const EditorDivider = styled(Divider)` const EditorDivider = styled(Divider)`
background: ${({ theme }) => theme.colors.neutral200}; background: ${({ theme }) => theme.colors.neutral200};
`; `;
@ -32,7 +38,7 @@ const Wrapper = styled(Box)`
`; `;
const BlocksEditor = React.forwardRef( const BlocksEditor = React.forwardRef(
({ intlLabel, name, disabled, required, error, value, onChange }, ref) => { ({ intlLabel, labelAction, name, disabled, required, error, value, onChange }, ref) => {
const { formatMessage } = useIntl(); const { formatMessage } = useIntl();
const [editor] = React.useState(() => withReact(withHistory(createEditor()))); const [editor] = React.useState(() => withReact(withHistory(createEditor())));
@ -75,6 +81,7 @@ const BlocksEditor = React.forwardRef(
{label} {label}
{required && <TypographyAsterisk textColor="danger600">*</TypographyAsterisk>} {required && <TypographyAsterisk textColor="danger600">*</TypographyAsterisk>}
</Typography> </Typography>
{labelAction && <LabelAction paddingLeft={1}>{labelAction}</LabelAction>}
</Flex> </Flex>
<Slate <Slate
editor={editor} editor={editor}
@ -103,6 +110,7 @@ const BlocksEditor = React.forwardRef(
); );
BlocksEditor.defaultProps = { BlocksEditor.defaultProps = {
labelAction: null,
required: false, required: false,
error: '', error: '',
value: null, value: null,
@ -114,6 +122,7 @@ BlocksEditor.propTypes = {
defaultMessage: PropTypes.string.isRequired, defaultMessage: PropTypes.string.isRequired,
values: PropTypes.object, values: PropTypes.object,
}).isRequired, }).isRequired,
labelAction: PropTypes.element,
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
required: PropTypes.bool, required: PropTypes.bool,
disabled: PropTypes.bool.isRequired, disabled: PropTypes.bool.isRequired,