diff --git a/src/plugins/toolbar/components/BoldItalicUnderlineToggles.tsx b/src/plugins/toolbar/components/BoldItalicUnderlineToggles.tsx index 24874379..4b70c1ac 100644 --- a/src/plugins/toolbar/components/BoldItalicUnderlineToggles.tsx +++ b/src/plugins/toolbar/components/BoldItalicUnderlineToggles.tsx @@ -41,7 +41,7 @@ export interface BoldItalicUnderlineTogglesProps { * A toolbar component that lets the user toggle bold, italic and underline formatting. * @group Toolbar Components */ -export const BoldItalicUnderlineToggles: React.FC = ({ options }: BoldItalicUnderlineTogglesProps) => { +export const BoldItalicUnderlineToggles: React.FC = ({ options }) => { const t = useTranslation() const showAllButtons = typeof options === 'undefined' @@ -78,35 +78,47 @@ export const BoldItalicUnderlineToggles: React.FC = ({ options }: BoldItalicUnde ) } +export interface StrikeThroughSupSubTogglesProps { + options?: ('Strikethrough' | 'Sub' | 'Sup')[] +} + /** * A toolbar component that lets the user toggle strikeThrough, superscript and subscript formatting. * @group Toolbar Components */ -export const StrikeThroughSupSubToggles: React.FC = () => { +export const StrikeThroughSupSubToggles: React.FC = ({ options }) => { const t = useTranslation() + const showAllButtons = typeof options === 'undefined' + return (
- - - + {showAllButtons || options.includes('Strikethrough') ? ( + + ) : null} + {showAllButtons || options.includes('Sup') ? ( + + ) : null} + {showAllButtons || options.includes('Sub') ? ( + + ) : null}
) }