UNPKG

@atlaskit/editor-plugin-text-color

Version:

Text color plugin for @atlaskit/editor-core

158 lines (157 loc) 7.38 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.textColorPlugin = void 0; var _react = _interopRequireDefault(require("react")); var _adfSchema = require("@atlaskit/adf-schema"); var _platformFeatureFlags = require("@atlaskit/platform-feature-flags"); var _experiments = require("@atlaskit/tmp-editor-statsig/experiments"); var _changeColor2 = require("./editor-commands/change-color"); var _palette = require("./editor-commands/palette"); var _changeColor3 = require("./pm-plugins/commands/change-color"); var _keymap = require("./pm-plugins/keymap"); var _main = require("./pm-plugins/main"); var _FloatingToolbarComponent = require("./ui/FloatingToolbarComponent"); var _PrimaryToolbarComponent = require("./ui/PrimaryToolbarComponent"); var _toolbarComponents = require("./ui/toolbar-components"); var pluginConfig = function pluginConfig(textColorConfig) { if (!textColorConfig || typeof textColorConfig === 'boolean') { return undefined; } return textColorConfig; }; var isToolbarComponentEnabled = function isToolbarComponentEnabled(textColorConfig) { return textColorConfig === undefined || textColorConfig.toolbarConfig === undefined || textColorConfig.toolbarConfig.enabled !== false; }; var textColorPlugin = exports.textColorPlugin = function textColorPlugin(_ref) { var textColorConfig = _ref.config, api = _ref.api; var isToolbarAIFCEnabled = Boolean(api === null || api === void 0 ? void 0 : api.toolbar); var primaryToolbarComponent = function primaryToolbarComponent(_ref2) { var editorView = _ref2.editorView, popupsMountPoint = _ref2.popupsMountPoint, popupsBoundariesElement = _ref2.popupsBoundariesElement, popupsScrollableElement = _ref2.popupsScrollableElement, isToolbarReducedSpacing = _ref2.isToolbarReducedSpacing, dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent, disabled = _ref2.disabled; if (!editorView) { return null; } return /*#__PURE__*/_react.default.createElement(_PrimaryToolbarComponent.PrimaryToolbarComponent, { isReducedSpacing: isToolbarReducedSpacing, editorView: editorView, popupsMountPoint: popupsMountPoint, popupsBoundariesElement: popupsBoundariesElement, popupsScrollableElement: popupsScrollableElement, dispatchAnalyticsEvent: dispatchAnalyticsEvent, disabled: disabled, api: api }); }; if (isToolbarAIFCEnabled) { if ((0, _platformFeatureFlags.fg)('platform_editor_toolbar_aifc_text_color_config') || (0, _platformFeatureFlags.fg)('platform_editor_toolbar_aifc_text_color_config_jsm')) { var _api$toolbar; if (api !== null && api !== void 0 && (_api$toolbar = api.toolbar) !== null && _api$toolbar !== void 0 && _api$toolbar.actions.registerComponents && isToolbarComponentEnabled(pluginConfig(textColorConfig))) { api.toolbar.actions.registerComponents((0, _toolbarComponents.getToolbarComponents)(api)); } } else { var _api$toolbar2; if (api !== null && api !== void 0 && (_api$toolbar2 = api.toolbar) !== null && _api$toolbar2 !== void 0 && _api$toolbar2.actions.registerComponents) { api.toolbar.actions.registerComponents((0, _toolbarComponents.getToolbarComponents)(api)); } } } else { var _api$primaryToolbar; api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({ name: 'textColor', component: primaryToolbarComponent }); } return { name: 'textColor', marks: function marks() { return [{ name: 'textColor', mark: _adfSchema.textColor }]; }, pmPlugins: function pmPlugins() { return isToolbarAIFCEnabled ? [{ name: 'textColor', plugin: function plugin(_ref3) { var dispatch = _ref3.dispatch; return (0, _main.createPlugin)(dispatch, pluginConfig(textColorConfig)); } }, { name: 'textColorKeymap', plugin: function plugin() { return (0, _keymap.keymapPlugin)({ api: api }); } }] : [{ name: 'textColor', plugin: function plugin(_ref4) { var dispatch = _ref4.dispatch; return (0, _main.createPlugin)(dispatch, pluginConfig(textColorConfig)); } }]; }, getSharedState: function getSharedState(editorState) { if (!editorState) { return undefined; } return _main.pluginKey.getState(editorState); }, actions: { changeColor: function changeColor(color, inputMethod) { var _api$analytics; return (0, _changeColor3.changeColor)(color, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, inputMethod); } }, commands: { changeColor: function changeColor(color, inputMethod) { return (0, _changeColor2.changeColor)(color, api, inputMethod); }, setPalette: function setPalette(isPaletteOpen) { return (0, _palette.setPalette)(isPaletteOpen); } }, pluginsOptions: !isToolbarAIFCEnabled ? { selectionToolbar: function selectionToolbar() { var _api$userPreferences, _api$selectionToolbar; var toolbarDocking = (0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin') ? api === null || api === void 0 || (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.sharedState) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.currentState()) === null || _api$userPreferences === void 0 ? void 0 : _api$userPreferences.preferences.toolbarDockingPosition : api === null || api === void 0 || (_api$selectionToolbar = api.selectionToolbar) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar = _api$selectionToolbar.sharedState) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar = _api$selectionToolbar.currentState()) === null || _api$selectionToolbar === void 0 ? void 0 : _api$selectionToolbar.toolbarDocking; if (toolbarDocking === 'none' && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1', { exposure: true })) { var toolbarCustom = { type: 'custom', render: function render(view, _idx, dispatchAnalyticsEvent) { if (!view) { return; } return /*#__PURE__*/_react.default.createElement(_FloatingToolbarComponent.FloatingToolbarComponent, { editorView: view, dispatchAnalyticsEvent: dispatchAnalyticsEvent, api: api }); }, fallback: [] }; return { isToolbarAbove: true, items: [toolbarCustom], rank: 6, pluginName: 'textColor' }; } else { return undefined; } } } : {}, primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined }; };