UNPKG

@atlaskit/editor-plugin-panel

Version:

Panel plugin for @atlaskit/editor-core.

97 lines 6.29 kB
import _defineProperty from "@babel/runtime/helpers/defineProperty"; function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } import { PanelType } from '@atlaskit/adf-schema'; import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel'; import { hexToEditorBackgroundPaletteColor } from '@atlaskit/editor-palette'; import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state'; import { findParentNode, findParentNodeOfType, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils'; import { fg } from '@atlaskit/platform-feature-flags'; import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals'; export var findPanel = function findPanel(state, selection) { var panel = state.schema.nodes.panel; return findSelectedNodeOfType(panel)(selection || state.selection) || findParentNodeOfType(panel)(selection || state.selection); }; export var panelAttrsToDom = function panelAttrsToDom(attrs, allowCustomPanel) { var panelColor = attrs.panelColor, panelType = attrs.panelType, panelIcon = attrs.panelIcon, panelIconId = attrs.panelIconId, panelIconText = attrs.panelIconText; var isCustomPanel = panelType === PanelType.CUSTOM && allowCustomPanel; var hasIcon = !isCustomPanel || !!panelIcon || !!panelIconId; var tokenColor = expValEquals('platform_editor_stricter_panelcolor_typecheck', 'isEnabled', true) ? typeof panelColor === 'string' && hexToEditorBackgroundPaletteColor(panelColor) : panelColor && hexToEditorBackgroundPaletteColor(panelColor); var panelBackgroundColor = tokenColor || panelColor; var style = ["".concat((expValEquals('platform_editor_stricter_panelcolor_typecheck', 'isEnabled', true) ? typeof panelColor === 'string' && isCustomPanel : panelColor && isCustomPanel) ? "background-color: ".concat(panelBackgroundColor, ";") : ''), "".concat(!hasIcon && !fg('platform_editor_nested_dnd_styles_changes') ? "padding-left: 12px;padding-right: 12px;" : '')].join(''); var panelAttrs = { class: "".concat(PanelSharedCssClassName.prefix).concat(!hasIcon && fg('platform_editor_nested_dnd_styles_changes') ? " ".concat(PanelSharedCssClassName.noIcon) : ''), 'data-panel-type': panelType || PanelType.INFO, 'data-testid': 'panel-node-view', style: style }; if (panelColor && isCustomPanel) { panelAttrs = _objectSpread(_objectSpread({}, panelAttrs), {}, { 'data-panel-color': panelColor, 'data-panel-icon-id': panelIconId, 'data-panel-icon-text': panelIconText }); } // Required for parseDOM to correctly parse custom panel when NodeView DOM is copied directly // Schema's parseDOM expects data-panel-icon on all custom panels, not just ones with color if (isCustomPanel) { panelAttrs = _objectSpread(_objectSpread({}, panelAttrs), {}, { 'data-panel-icon': panelIcon }); } if (fg('platform_editor_adf_with_localid')) { panelAttrs = _objectSpread(_objectSpread({}, panelAttrs), {}, { 'data-local-id': attrs.localId }); } var iconDiv = ['div', // EDITOR-266 This fixes an issue in LCM where if you have nested panels // The icon colour will be overridden by the parent panel style, this is used to create a more specific css selector { class: PanelSharedCssClassName.icon, 'data-panel-type': panelType || PanelType.INFO }]; var contentDiv = ['div', { class: PanelSharedCssClassName.content }, 0]; if (hasIcon) { return ['div', panelAttrs, iconDiv, contentDiv]; } else { return ['div', panelAttrs, contentDiv]; } }; export var handleCut = function handleCut(newState, oldState) { var newTr = newState.tr; var schema = newState.doc.type.schema; if (panelContentCheck(newState, oldState)) { // Create a panel using oldState with an empty paragraph node // and insert it in the same location when panel previously existed var emptyParagraph = schema.nodes.paragraph.create(); var oldPanelNode = findParentNode(function (node) { return node.type.name === 'panel'; })(oldState.tr.selection); var clonedPanelNode = oldPanelNode === null || oldPanelNode === void 0 ? void 0 : oldPanelNode.node.copy(); var newPanelNode = schema.nodes.panel.create(_objectSpread({}, clonedPanelNode === null || clonedPanelNode === void 0 ? void 0 : clonedPanelNode.attrs), emptyParagraph); var endPos = oldState.tr.selection.$from.pos; if (oldPanelNode) { newTr.insert(oldPanelNode.pos, newPanelNode).setSelection(new TextSelection(newTr.doc.resolve(endPos))); return newTr; } } }; export var panelContentCheck = function panelContentCheck(newState, oldState) { // The following fuctions checks if * // a. old selection is a NodeSelection. // b. parent element a panel and does it have only one child // c. parent node has a decision list and that decision list only has one decision item // OR old selection is a codeblock OR old selection is a rule var isNodeSelection = oldState.tr.selection instanceof NodeSelection; var isNodeTypeRuleOrCodeBlock = isNodeSelection && ['codeBlock', 'rule'].includes(oldState.tr.selection.node.type.name); var isParentTypePanel = findParentNodeOfType(newState.schema.nodes.panel)(oldState.tr.selection); var isparentTypeDecision = findParentNodeOfType(newState.schema.nodes.decisionList)(oldState.tr.selection); return Boolean(isNodeSelection && (isParentTypePanel === null || isParentTypePanel === void 0 ? void 0 : isParentTypePanel.node.childCount) === 1 && ((isparentTypeDecision === null || isparentTypeDecision === void 0 ? void 0 : isparentTypeDecision.node.childCount) === 1 || isNodeTypeRuleOrCodeBlock)); };