fix(document-api): fix cell shading in document api (#2215)

* fix(document-api): fix cell shading in document api

* fix(document-api): fix auto color in setShading for tables

Author: harbournick

packages/super-editor/src/document-api-adapters/tables-adapter.regressions.test.ts

@@ -570,6 +570,56 @@ describe('tables-adapter regressions', () => {
     });
   });
 
+  it('applies table shading to all cells when target is a table', () => {
+    const editor = makeTableEditor();
+    const tr = editor.state.tr as unknown as { setNodeMarkup: ReturnType<typeof vi.fn> };
+
+    const result = tablesSetShadingAdapter(editor, {
+      nodeId: 'table-1',
+      color: 'FFFF00',
+    });
+
+    expect(result.success).toBe(true);
+
+    const cellUpdates = tr.setNodeMarkup.mock.calls.filter(
+      (call) =>
+        typeof call[2] === 'object' &&
+        call[2] != null &&
+        (call[2] as { tableCellProperties?: { shading?: { fill?: string } } }).tableCellProperties?.shading?.fill ===
+          'FFFF00',
+    );
+
+    expect(cellUpdates).toHaveLength(4);
+    for (const call of cellUpdates) {
+      expect((call[2] as { background?: { color?: string } }).background).toEqual({ color: 'FFFF00' });
+    }
+  });
+
+  it('does not write cell background when table shading color is auto', () => {
+    const editor = makeTableEditor();
+    const tr = editor.state.tr as unknown as { setNodeMarkup: ReturnType<typeof vi.fn> };
+
+    const result = tablesSetShadingAdapter(editor, {
+      nodeId: 'table-1',
+      color: 'auto',
+    });
+
+    expect(result.success).toBe(true);
+
+    const cellUpdates = tr.setNodeMarkup.mock.calls.filter(
+      (call) =>
+        typeof call[2] === 'object' &&
+        call[2] != null &&
+        (call[2] as { tableCellProperties?: { shading?: { fill?: string } } }).tableCellProperties?.shading?.fill ===
+          'auto',
+    );
+
+    expect(cellUpdates).toHaveLength(4);
+    for (const call of cellUpdates) {
+      expect((call[2] as { background?: unknown }).background).toBeUndefined();
+    }
+  });
+
   it.each([
     {
       name: 'tables.setBorder',

packages/super-editor/src/document-api-adapters/tables-adapter.ts

@@ -2669,6 +2669,38 @@ export function tablesSetShadingAdapter(
     currentProps.shading = { fill: input.color, val: 'clear', color: 'auto' };
     const syncAttrs = resolved.scope === 'table' ? syncExtractedTableAttrs(currentProps) : {};
     tr.setNodeMarkup(resolved.pos, null, { ...currentAttrs, [propsKey]: currentProps, ...syncAttrs });
+
+    if (resolved.scope === 'table') {
+      const tableNode = resolved.node;
+      const tableStart = resolved.pos + 1;
+      const map = TableMap.get(tableNode);
+      const seen = new Set<number>();
+      const mapFrom = tr.mapping.maps.length;
+
+      for (let i = 0; i < map.map.length; i++) {
+        const relPos = map.map[i]!;
+        if (seen.has(relPos)) continue;
+        seen.add(relPos);
+
+        const cellNode = tableNode.nodeAt(relPos);
+        if (!cellNode) continue;
+
+        const cellAttrs = cellNode.attrs as Record<string, unknown>;
+        const cellProps = { ...((cellAttrs.tableCellProperties ?? {}) as Record<string, unknown>) };
+        cellProps.shading = { fill: input.color, val: 'clear', color: 'auto' };
+
+        const nextCellAttrs: Record<string, unknown> = {
+          ...cellAttrs,
+          tableCellProperties: cellProps,
+        };
+
+        if (input.color === 'auto') delete nextCellAttrs.background;
+        else nextCellAttrs.background = { color: input.color };
+
+        tr.setNodeMarkup(tr.mapping.slice(mapFrom).map(tableStart + relPos), null, nextCellAttrs);
+      }
+    }
+
     applyDirectMutationMeta(tr);
     editor.dispatch(tr);
     clearIndexCache(editor);