@atlaskit/editor-plugin-text-color
Version:
Text color plugin for @atlaskit/editor-core
80 lines • 3.13 kB
JavaScript
/* RemoveColorMenuItem.tsx generated by @compiled/babel-plugin v0.39.1 */
import "./RemoveColorMenuItem.compiled.css";
import * as React from 'react';
import { ax, ix } from "@compiled/react/runtime";
import { useIntl } from 'react-intl';
import Button from '@atlaskit/button/new';
import { highlightMessages as messages } from '@atlaskit/editor-common/messages';
import { getInputMethodFromParentKeys } from '@atlaskit/editor-common/toolbar';
import { REMOVE_HIGHLIGHT_COLOR } from '@atlaskit/editor-common/ui-color';
import { useToolbarDropdownMenu } from '@atlaskit/editor-toolbar';
import ColourNoneIcon from '@atlaskit/icon-lab/core/colour-none';
import { Text } from '@atlaskit/primitives/compiled';
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
const styles = {
removeColorButton: "_2rko12b0 _195gv77o _189ee4h9 _1dqonqa1 _1h6d1l7x _19pk12x7",
iconContainer: "_zulp12x7 _1e0c1txw _4cvr1h6o _1bah1h6o"
};
export const RemoveColorMenuItem = ({
api,
parents
}) => {
const {
formatMessage
} = useIntl();
const context = useToolbarDropdownMenu();
const closeMenu = context === null || context === void 0 ? void 0 : context.closeMenu;
const onClick = event => {
var _api$textColor$shared;
if (!api) {
return;
}
const defaultColor = (_api$textColor$shared = api.textColor.sharedState.currentState()) === null || _api$textColor$shared === void 0 ? void 0 : _api$textColor$shared.defaultColor;
if (!defaultColor) {
return;
}
api.core.actions.execute(({
tr
}) => {
var _api$highlight;
api.textColor.commands.changeColor(defaultColor, getInputMethodFromParentKeys(parents))({
tr
});
(_api$highlight = api.highlight) === null || _api$highlight === void 0 ? void 0 : _api$highlight.commands.changeColor({
color: REMOVE_HIGHLIGHT_COLOR,
inputMethod: getInputMethodFromParentKeys(parents)
})({
tr
});
return tr;
});
if (!expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true)) {
closeMenu === null || closeMenu === void 0 ? void 0 : closeMenu(event);
}
};
if (expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true)) {
return /*#__PURE__*/React.createElement("div", {
className: ax([styles.removeColorButton])
}, /*#__PURE__*/React.createElement(Button, {
shouldFitContainer: true,
appearance: "subtle",
onClick: onClick
}, /*#__PURE__*/React.createElement("span", {
className: ax([styles.iconContainer])
}, /*#__PURE__*/React.createElement(ColourNoneIcon, {
size: "medium",
label: ""
}), /*#__PURE__*/React.createElement(Text, {
weight: "medium"
}, formatMessage(messages.clearColors)))));
}
return /*#__PURE__*/React.createElement("div", {
className: ax([styles.removeColorButton])
}, /*#__PURE__*/React.createElement(Button, {
shouldFitContainer: true,
appearance: "subtle",
onClick: onClick
}, /*#__PURE__*/React.createElement(Text, {
weight: "medium"
}, formatMessage(messages.removeColor))));
};