@atlaskit/editor-plugin-show-diff 13.0.11 → 13.1.1

package/dist/es2019/pm-plugins/decorations/utils/wrapBlockNodeViewStyles.js

@@ -0,0 +1,143 @@
+/**
+ * Style resolution for the `wrapBlockNodeView` nodeview decorations.
+ *
+ * Every exported resolver is a single gate: the `colorSchemeRegistry` + `factory.ts`
+ * implementation when `platform_editor_show_diff_color_scheme_refactor` is on, and the verbatim
+ * pre-refactor per-scheme constants from `./wrapBlockNodeViewStyles.legacy` when it is off. The two
+ * paths are built to emit identical style strings for both shipped schemes, so this is a kill
+ * switch for a refactor rather than a behaviour experiment.
+ *
+ * On cleanup (EDITOR-8281): drop the `isExperimentEnabled` dispatch and the `*Legacy` imports,
+ * keeping the `*Next` bodies.
+ */
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { isExtendedEnabled } from '../../isExtendedEnabled';
+import { buildAddedCellOverlayRoundedStyle, buildAddedCellOverlayStyle, buildAddedCellOverlayStyleNew, buildDeletedCellOverlayRoundedStyle, buildDeletedCellOverlayStyle, buildDeletedInlineContentStyle, buildDeletedInlineContentStyleExtended, buildDeletedLozengeActiveStyle, buildDeletedLozengeStyle, buildDeletedQuoteNodeWithLozengeStyle, buildDeletedStrikethroughLine, buildDeletedWrappedBlockOutline, buildInsertedBlockNodeStyle, buildInsertedInlineStyle, buildInsertStyleInBlockExtended, buildInsertStyleInBlockExtendedNoUnderline, buildInsertStyleNode } from '../colorSchemes/factory';
+import { colorSchemeRegistry, standardScheme } from '../colorSchemes/schemes';
+import { getChangedContentStyleLegacy, getChangedNodeStyleLegacy, getDeletedContentStyleLegacy, getDeletedContentStyleUnboundedLegacy, getInsertedContentStyleLegacy, hasRestingDeletedRingLegacy, resolveCellOverlayStyleLegacy, resolveNestedInsertedNodeStyleLegacy, resolveRemovedLozengeStyleLegacy } from './wrapBlockNodeViewStyles.legacy';
+const DEFAULT_COLOR_SCHEME = 'standard';
+const getColorScheme = colorScheme => colorSchemeRegistry[colorScheme !== null && colorScheme !== void 0 ? colorScheme : DEFAULT_COLOR_SCHEME];
+
+/**
+ * Inserted content inside a multi-container or list node always uses the standard scheme, so a
+ * traditional diff shows purple here. Pre-existing: these call sites predate traditional.
+ * Preserved as-is; see EDITOR-8281.
+ */
+const nestedContentScheme = standardScheme;
+const lozengeStyle = buildDeletedLozengeStyle();
+
+/**
+ * Node-name classification shared by the style resolvers below and by the routing in
+ * `wrapBlockNodeView.ts`.
+ */
+export const isMultiContainerBlockNode = nodeName => {
+  return ['decisionList', 'layoutSection'].includes(nodeName);
+};
+export const isTextLikeBlockNode = nodeName => {
+  return ['heading', 'bulletList', 'orderedList', 'listItem', 'taskList', 'blockquote'].includes(nodeName);
+};
+const getChangedContentStyleNext = (colorScheme, isActive = false, isInserted = false, diffType, hideAddedDiffsUnderline = false) => {
+  const colors = getColorScheme(colorScheme);
+  if (isExtendedEnabled(diffType) && isInserted) {
+    return buildInsertedInlineStyle(colors, isActive, hideAddedDiffsUnderline);
+  }
+  if (isActive) {
+    return buildDeletedInlineContentStyle(colors, 'active');
+  }
+  return buildDeletedInlineContentStyle(colors, expValEquals('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? 'new' : 'default');
+};
+const getChangedNodeStyleNext = (nodeName, colorScheme, isInserted = false, isActive = false, diffType, hideAddedDiffsUnderline = false) => {
+  const colors = getColorScheme(colorScheme);
+  if (isExtendedEnabled(diffType) && isInserted) {
+    if (isMultiContainerBlockNode(nodeName)) {
+      return hideAddedDiffsUnderline ? buildInsertStyleInBlockExtendedNoUnderline(nestedContentScheme) : buildInsertStyleInBlockExtended(nestedContentScheme);
+    }
+    if (isTextLikeBlockNode(nodeName)) {
+      return undefined;
+    }
+    return buildInsertedBlockNodeStyle(colors, 'node', isActive);
+  }
+  switch (nodeName) {
+    case 'blockquote':
+      return buildDeletedQuoteNodeWithLozengeStyle(colors, isActive);
+    case 'expand':
+    case 'decisionList':
+      return buildDeletedWrappedBlockOutline(colors, {
+        isActive,
+        isRounded: false
+      });
+    case 'panel':
+    case 'codeBlock':
+      return buildDeletedWrappedBlockOutline(colors, {
+        isActive,
+        isRounded: true
+      });
+    default:
+      return undefined;
+  }
+};
+const getDeletedContentStyleUnboundedNext = (colorScheme, isActive = false) => buildDeletedStrikethroughLine(getColorScheme(colorScheme), isActive);
+const getInsertedContentStyleNext = (colorScheme, isActive = false, hideAddedDiffsUnderline = false) => buildInsertedInlineStyle(getColorScheme(colorScheme), isActive, hideAddedDiffsUnderline);
+const getDeletedContentStyleNext = (colorScheme, isActive = false, diffType) => {
+  const colors = getColorScheme(colorScheme);
+  const base = buildDeletedInlineContentStyle(colors, isActive ? 'active' : 'new');
+
+  // glyphTint adds a background highlight and border-bottom over the tint; strikethrough does not.
+  const needsExtendedHighlight = colors.deletedInlineTreatment === 'glyphTint' && isExtendedEnabled(diffType);
+  return needsExtendedHighlight ? base + buildDeletedInlineContentStyleExtended(colors) : base;
+};
+const resolveCellOverlayStyleNext = ({
+  colorScheme,
+  isInserted,
+  isRoundedTable
+}) => {
+  const colors = getColorScheme(colorScheme);
+
+  // Square added-cell overlays follow insertedNodeEmphasis: pressed background vs accent border.
+  const addedCellStyle = isRoundedTable ? buildAddedCellOverlayRoundedStyle(colors) : colors.insertedNodeEmphasis === 'stateful' ? buildAddedCellOverlayStyleNew(colors) : buildAddedCellOverlayStyle(colors);
+  const deletedCellStyle = isRoundedTable ? buildDeletedCellOverlayRoundedStyle(colors) : buildDeletedCellOverlayStyle(colors);
+  return isInserted ? addedCellStyle : deletedCellStyle;
+};
+const resolveRemovedLozengeStyleNext = (colorScheme, isActive) => isActive ? buildDeletedLozengeActiveStyle(getColorScheme(colorScheme)) : lozengeStyle;
+const resolveNestedInsertedNodeStyleNext = () => buildInsertStyleNode(nestedContentScheme);
+
+// Only 'stateful' schemes have a resting ring.
+const hasRestingDeletedRingNext = colorScheme => getColorScheme(colorScheme).deletedNodeEmphasis === 'stateful';
+
+/** Inline content style for a changed (inserted or deleted) block node. */
+export const getChangedContentStyle = (colorScheme, isActive = false, isInserted = false, diffType, hideAddedDiffsUnderline = false) => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? getChangedContentStyleNext(colorScheme, isActive, isInserted, diffType, hideAddedDiffsUnderline) : getChangedContentStyleLegacy(colorScheme, isActive, isInserted, diffType, hideAddedDiffsUnderline);
+
+/** Node-specific style for a changed block node, or `undefined` when the node type has none. */
+export const getChangedNodeStyle = (nodeName, colorScheme, isInserted = false, isActive = false, diffType, hideAddedDiffsUnderline = false) => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? getChangedNodeStyleNext(nodeName, colorScheme, isInserted, isActive, diffType, hideAddedDiffsUnderline) : getChangedNodeStyleLegacy(nodeName, colorScheme, isInserted, isActive, diffType, hideAddedDiffsUnderline);
+
+/** The positioned line drawn across deleted content spanning an unbounded range. */
+export const getDeletedContentStyleUnbounded = (colorScheme, isActive = false) => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? getDeletedContentStyleUnboundedNext(colorScheme, isActive) : getDeletedContentStyleUnboundedLegacy(colorScheme, isActive);
+
+/** Inline style for inserted content. */
+export const getInsertedContentStyle = (colorScheme, isActive = false, hideAddedDiffsUnderline = false) => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? getInsertedContentStyleNext(colorScheme, isActive, hideAddedDiffsUnderline) : getInsertedContentStyleLegacy(colorScheme, isActive, hideAddedDiffsUnderline);
+
+/** Inline style for deleted content. */
+export const getDeletedContentStyle = (colorScheme, isActive = false, diffType) => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? getDeletedContentStyleNext(colorScheme, isActive, diffType) : getDeletedContentStyleLegacy(colorScheme, isActive, diffType);
+
+/**
+ * Overlay style for one added or deleted table cell. Invariant across the cells of a table, so the
+ * `querySelectorAll('td, th')` loop in `wrapBlockNodeView.ts` resolves it once.
+ */
+export const resolveCellOverlayStyle = args => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? resolveCellOverlayStyleNext(args) : resolveCellOverlayStyleLegacy(args);
+
+/** Inner style for the "Removed" lozenge on a deleted block node. */
+export const resolveRemovedLozengeStyle = (colorScheme, isActive) => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? resolveRemovedLozengeStyleNext(colorScheme, isActive) : resolveRemovedLozengeStyleLegacy(colorScheme, isActive);
+
+/**
+ * Style for inserted content nested inside a multi-container or list node — the `decisionList` and
+ * `taskList` `li`s and the `layoutSection` columns. Scheme-independent: see
+ * `nestedContentScheme` above.
+ */
+export const resolveNestedInsertedNodeStyle = () => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? resolveNestedInsertedNodeStyleNext() : resolveNestedInsertedNodeStyleLegacy();
+
+/**
+ * Whether the colour scheme draws a resting (non-active) ring on a deleted media/embed node, which
+ * is what the `show-diff-deleted-outline-new` class styles in editor-core's smartCardStyles.
+ */
+export const hasRestingDeletedRing = colorScheme => isExperimentEnabled('platform_editor_show_diff_color_scheme_refactor') ? hasRestingDeletedRingNext(colorScheme) : hasRestingDeletedRingLegacy(colorScheme);

package/dist/es2019/pm-plugins/decorations/utils/wrapBlockNodeViewStyles.legacy.js

@@ -0,0 +1,200 @@
+/**
+ * Pre-refactor code preserved for the OFF cohort of
+ * `platform_editor_show_diff_color_scheme_refactor`.
+ *
+ * These resolvers hold, verbatim, the per-scheme string-constant style decisions that
+ * `wrapBlockNodeView.ts` made before the `colorSchemeRegistry` + `factory.ts` migration — same
+ * branches, same ternaries, same order, same shim constants, same module-level constants.
+ *
+ * Do not modify. Delete this file at experiment cleanup, together with `colorSchemes/standard.ts`,
+ * `colorSchemes/traditional.ts` (EDITOR-8281).
+ */
+import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { isExtendedEnabled } from '../../isExtendedEnabled';
+import { deletedBlockOutline, deletedBlockOutlineActive, deletedBlockOutlineRounded, deletedBlockOutlineRoundedActive, deletedContentStyle, deletedContentStyleActive, deletedContentStyleNew, deletedContentStyleUnbounded, deletedInlineContentStyleExtended, deletedStyleQuoteNodeWithLozenge, deletedStyleQuoteNodeWithLozengeActive, editingContentStyleInBlockExtended, editingContentStyleInBlockExtendedNoUnderline, editingStyleExtended, editingStyleExtendedNoUnderline, editingStyleActiveExtended, editingStyleActiveExtendedNoUnderline, editingStyleNode, addedCellOverlayStyle, addedCellOverlayRoundedStyle, deletedCellOverlayStyle, deletedCellOverlayRoundedStyle } from '../colorSchemes/standard';
+import { deletedTraditionalBlockOutlineActive, deletedTraditionalBlockOutlineNew, deletedTraditionalBlockOutlineRoundedActive, deletedTraditionalBlockOutlineRoundedNew, deletedTraditionalContentStyleUnbounded, deletedTraditionalContentStyleUnboundedActive, getDeletedTraditionalInlineStyle, deletedTraditionalStyleQuoteNode, deletedTraditionalStyleQuoteNodeActive, traditionalInsertStyle, traditionalInsertStyleActive, traditionalStyleNodeActive, traditionalStyleNodeNew, traditionalAddedCellOverlayRoundedStyle, traditionalAddedCellOverlayStyleNew, deletedTraditionalCellOverlayStyle, deletedTraditionalCellOverlayRoundedStyle } from '../colorSchemes/traditional';
+const lozengeStyle = convertToInlineCss({
+  display: 'inline-flex',
+  boxSizing: 'border-box',
+  position: 'static',
+  blockSize: 'min-content',
+  borderRadius: "var(--ds-radius-small, 4px)",
+  overflow: 'hidden',
+  paddingInlineStart: "var(--ds-space-050, 4px)",
+  paddingInlineEnd: "var(--ds-space-050, 4px)",
+  backgroundColor: "var(--ds-background-accent-gray-subtler, #DDDEE1)",
+  font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
+  fontWeight: "var(--ds-font-weight-bold, 653)",
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap',
+  color: "var(--ds-text-warning-inverse, #292A2E)"
+});
+const lozengeStyleActiveStandard = convertToInlineCss({
+  display: 'inline-flex',
+  boxSizing: 'border-box',
+  position: 'static',
+  blockSize: 'min-content',
+  borderRadius: "var(--ds-radius-small, 4px)",
+  overflow: 'hidden',
+  paddingInlineStart: "var(--ds-space-050, 4px)",
+  paddingInlineEnd: "var(--ds-space-050, 4px)",
+  backgroundColor: "var(--ds-background-accent-red-subtler-pressed, #FD9891)",
+  font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
+  fontWeight: "var(--ds-font-weight-bold, 653)",
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap',
+  color: "var(--ds-text-warning-inverse, #292A2E)"
+});
+const lozengeStyleActiveTraditional = convertToInlineCss({
+  display: 'inline-flex',
+  boxSizing: 'border-box',
+  position: 'static',
+  blockSize: 'min-content',
+  borderRadius: "var(--ds-radius-small, 4px)",
+  overflow: 'hidden',
+  paddingInlineStart: "var(--ds-space-050, 4px)",
+  paddingInlineEnd: "var(--ds-space-050, 4px)",
+  backgroundColor: "var(--ds-background-accent-red-subtler-pressed, #FD9891)",
+  font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
+  fontWeight: "var(--ds-font-weight-bold, 653)",
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap',
+  color: "var(--ds-text-warning-inverse, #292A2E)"
+});
+
+/**
+ * Frozen copies of the two node-name predicates `getChangedNodeStyle` branched on pre-refactor.
+ * The live copies are exported from `./wrapBlockNodeViewStyles`; these exist so this module stays
+ * self-contained (and so the OFF cohort keeps the exact pre-refactor classification) and go away
+ * with the rest of the file at cleanup.
+ */
+const isMultiContainerBlockNode = nodeName => {
+  return ['decisionList', 'layoutSection'].includes(nodeName);
+};
+const isTextLikeBlockNode = nodeName => {
+  return ['heading', 'bulletList', 'orderedList', 'listItem', 'taskList', 'blockquote'].includes(nodeName);
+};
+
+/** Pre-refactor inline content style for a changed (inserted or deleted) block node. */
+export const getChangedContentStyleLegacy = (colorScheme, isActive = false, isInserted = false, diffType, hideAddedDiffsUnderline = false) => {
+  if (isExtendedEnabled(diffType) && isInserted) {
+    if (colorScheme === 'traditional') {
+      return isActive ? traditionalInsertStyleActive : traditionalInsertStyle;
+    }
+    return isActive ? hideAddedDiffsUnderline ? editingStyleActiveExtendedNoUnderline : editingStyleActiveExtended : hideAddedDiffsUnderline ? editingStyleExtendedNoUnderline : editingStyleExtended;
+  }
+  if (colorScheme === 'traditional') {
+    return getDeletedTraditionalInlineStyle(isActive);
+  }
+  if (isActive) {
+    return deletedContentStyleActive;
+  }
+  return expValEquals('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? deletedContentStyleNew : deletedContentStyle;
+};
+
+/** Pre-refactor node-specific style for a changed block node. */
+export const getChangedNodeStyleLegacy = (nodeName, colorScheme, isInserted = false, isActive = false, diffType, hideAddedDiffsUnderline = false) => {
+  const isTraditional = colorScheme === 'traditional';
+  if (isExtendedEnabled(diffType) && isInserted) {
+    if (isMultiContainerBlockNode(nodeName)) {
+      return hideAddedDiffsUnderline ? editingContentStyleInBlockExtendedNoUnderline : editingContentStyleInBlockExtended;
+    }
+    if (isTextLikeBlockNode(nodeName)) {
+      return undefined;
+    }
+    if (isTraditional) {
+      return isActive ? traditionalStyleNodeActive : traditionalStyleNodeNew;
+    }
+    return editingStyleNode;
+  }
+  switch (nodeName) {
+    case 'blockquote':
+      if (isTraditional) {
+        return isActive ? deletedTraditionalStyleQuoteNodeActive : deletedTraditionalStyleQuoteNode;
+      }
+      return isActive ? deletedStyleQuoteNodeWithLozengeActive : deletedStyleQuoteNodeWithLozenge;
+    case 'expand':
+    case 'decisionList':
+      if (isTraditional) {
+        return isActive ? deletedTraditionalBlockOutlineActive : deletedTraditionalBlockOutlineNew;
+      }
+      return isActive ? deletedBlockOutlineActive : deletedBlockOutline;
+    case 'panel':
+    case 'codeBlock':
+      if (isTraditional) {
+        return isActive ? deletedTraditionalBlockOutlineRoundedActive : deletedTraditionalBlockOutlineRoundedNew;
+      }
+      return isActive ? deletedBlockOutlineRoundedActive : deletedBlockOutlineRounded;
+    default:
+      return undefined;
+  }
+};
+
+/** Pre-refactor unbounded strikethrough line for deleted content. */
+export const getDeletedContentStyleUnboundedLegacy = (colorScheme, isActive = false) => {
+  if (colorScheme === 'traditional' && isActive) {
+    return deletedTraditionalContentStyleUnboundedActive;
+  }
+  return colorScheme === 'traditional' ? deletedTraditionalContentStyleUnbounded : deletedContentStyleUnbounded;
+};
+
+/** Pre-refactor inline style for inserted content. */
+export const getInsertedContentStyleLegacy = (colorScheme, isActive = false, hideAddedDiffsUnderline = false) => {
+  if (colorScheme === 'traditional') {
+    return isActive ? traditionalInsertStyleActive : traditionalInsertStyle;
+  }
+  if (isActive) {
+    return hideAddedDiffsUnderline ? editingStyleActiveExtendedNoUnderline : editingStyleActiveExtended;
+  }
+  return hideAddedDiffsUnderline ? editingStyleExtendedNoUnderline : editingStyleExtended;
+};
+
+/** Pre-refactor inline style for deleted content. */
+export const getDeletedContentStyleLegacy = (colorScheme, isActive = false, diffType) => {
+  if (colorScheme === 'traditional') {
+    return getDeletedTraditionalInlineStyle(isActive);
+  }
+  if (isExtendedEnabled(diffType)) {
+    return (isActive ? deletedContentStyleActive : deletedContentStyleNew) + deletedInlineContentStyleExtended;
+  }
+  return isActive ? deletedContentStyleActive : deletedContentStyleNew;
+};
+
+/**
+ * Pre-refactor table-cell overlay style, as chosen inside the `querySelectorAll('td, th')` loop of
+ * `applyCellOverlayStyles`. The choice does not vary per cell, so hoisting it out of the loop is
+ * behaviour-preserving.
+ *
+ * NOTE: not interchangeable with the same-named resolver in
+ * `createChangedRowDecorationWidgets.styles.legacy.ts`. The two pre-refactor call sites disagreed
+ * for the traditional non-rounded added cell — the nodeview path (here) used
+ * `traditionalAddedCellOverlayStyleNew`, the row-widget path used `traditionalAddedCellOverlayStyle`.
+ * Preserved as-is.
+ */
+export const resolveCellOverlayStyleLegacy = ({
+  colorScheme,
+  isInserted,
+  isRoundedTable
+}) => {
+  const isTraditional = colorScheme === 'traditional';
+  const deletedCellStyle = isTraditional ? isRoundedTable ? deletedTraditionalCellOverlayRoundedStyle : deletedTraditionalCellOverlayStyle : isRoundedTable ? deletedCellOverlayRoundedStyle : deletedCellOverlayStyle;
+  const addedCellStyle = isTraditional ? isRoundedTable ? traditionalAddedCellOverlayRoundedStyle : traditionalAddedCellOverlayStyleNew : isRoundedTable ? addedCellOverlayRoundedStyle : addedCellOverlayStyle;
+  return isInserted ? addedCellStyle : deletedCellStyle;
+};
+
+/** Pre-refactor inner style for the "Removed" lozenge on a deleted block node. */
+export const resolveRemovedLozengeStyleLegacy = (colorScheme, isActive) => isActive && colorScheme === 'traditional' ? lozengeStyleActiveTraditional : isActive ? lozengeStyleActiveStandard : lozengeStyle;
+
+/**
+ * Pre-refactor style for inserted content nested inside a multi-container or list node (the
+ * `decisionList` / `layoutSection` / `taskList` children). Always the standard scheme's node
+ * outline, in every colour scheme.
+ */
+export const resolveNestedInsertedNodeStyleLegacy = () => editingStyleNode;
+
+/**
+ * Pre-refactor scheme predicate behind `maybeAddDeletedOutlineNewClass`. The `!isActive` half of
+ * the original condition stays at the call site in `wrapBlockNodeView.ts`.
+ */
+export const hasRestingDeletedRingLegacy = colorScheme => colorScheme === 'traditional';