@atlaskit/editor-plugin-text-formatting
Version:
Text-formatting plugin for @atlaskit/editor-core
46 lines (45 loc) • 1.75 kB
JavaScript
/**
* @jsxRuntime classic
* @jsx jsx
*/
import React, { useCallback } from 'react';
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
import { jsx } from '@emotion/react';
import { buttonGroupStyle } from '@atlaskit/editor-common/styles';
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
export const SingleToolbarButtons = /*#__PURE__*/React.memo(({
items,
isReducedSpacing,
editorView
}) => {
const onClick = useCallback(command => {
return () => {
command(editorView.state, editorView.dispatch);
return false;
};
}, [editorView.state, editorView.dispatch]);
return (
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
jsx("span", {
css:
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
buttonGroupStyle
}, items.map(item => {
var _item$ariaLabel;
return jsx(ToolbarButton, {
key: item.key,
testId: `editor-toolbar__${String(item.content)}`,
buttonId: item.buttonId,
spacing: isReducedSpacing ? 'none' : 'default',
onClick: onClick(item.command),
selected: item.isActive,
disabled: item.isDisabled,
title: item.tooltipElement,
iconBefore: item.iconElement,
"aria-pressed": item.isActive,
"aria-label": (_item$ariaLabel = item['aria-label']) !== null && _item$ariaLabel !== void 0 ? _item$ariaLabel : String(item.content),
"aria-keyshortcuts": item['aria-keyshortcuts']
});
}))
);
});