Merge branch 'canary' into fix/issue-11515

Fixes #14608

## Summary

Fix printing issues when exporting documents while using the dark theme.

Previously, when printing or saving a document as PDF in dark mode, text
color was forced to black while some block containers (such as code
blocks and quotes) retained their dark backgrounds. This resulted in
**black text on dark backgrounds**, making the content unreadable in the
exported PDF.

## Changes

* Reset relevant CSS variables in the `@media print` section of
`print-to-pdf.ts`.
* Ensure block containers such as **code blocks and quotes** render with
light backgrounds during printing.
* Maintain readable text colors by forcing text color to black for print
output.

This approach updates the **CSS variables used by BlockSuite
components**, ensuring that elements relying on variables like
`--affine-background-code-block` and `--affine-quote-color` correctly
switch to light backgrounds in print mode.

## Result

Documents printed or exported as PDF from dark mode now render correctly
with:

* readable text
* proper light backgrounds for code blocks and quotes
* consistent formatting in print output


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Style**
* Enhanced print-to-PDF styling for improved visual presentation of code
blocks, quotes, and borders when exporting or printing documents to
maintain better readability and consistency.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Co-authored-by: sahilkhan09k <sahilkhan392005@gmail.com>

blocksuite/affine/gfx/shape/src/text/edgeless-shape-text-editor.ts

@@ -3,11 +3,8 @@ import {
   EdgelessCRUDIdentifier,
   TextUtils,
 } from '@blocksuite/affine-block-surface';
-import {
-  MindmapElementModel,
-  ShapeElementModel,
-  TextResizing,
-} from '@blocksuite/affine-model';
+import type { ShapeElementModel } from '@blocksuite/affine-model';
+import { MindmapElementModel, TextResizing } from '@blocksuite/affine-model';
 import type { RichText } from '@blocksuite/affine-rich-text';
 import { ThemeProvider } from '@blocksuite/affine-shared/services';
 import { getSelectedRect } from '@blocksuite/affine-shared/utils';
@@ -29,7 +26,7 @@ import { styleMap } from 'lit/directives/style-map.js';
 import * as Y from 'yjs';
 
 export function mountShapeTextEditor(
-  shapeElement: ShapeElementModel,
+  shapeElement: { id: string; text?: Y.Text } | null | undefined,
   edgeless: BlockComponent
 ) {
   const mountElm = edgeless.querySelector('.edgeless-mount-point');
@@ -43,24 +40,27 @@ export function mountShapeTextEditor(
   const gfx = edgeless.std.get(GfxControllerIdentifier);
   const crud = edgeless.std.get(EdgelessCRUDIdentifier);
 
+  if (!shapeElement?.id) {
+    console.error('Cannot mount text editor on an invalid shape element');
+    return;
+  }
+
   const updatedElement = crud.getElementById(shapeElement.id);
 
-  if (!(updatedElement instanceof ShapeElementModel)) {
+  if (!updatedElement || !('id' in updatedElement)) {
     console.error('Cannot mount text editor on a non-shape element');
     return;
   }
 
   gfx.tool.setTool(DefaultTool);
   gfx.selection.set({
-    elements: [shapeElement.id],
+    elements: [updatedElement.id],
     editing: true,
   });
 
-  if (!shapeElement.text) {
+  if (!updatedElement.text) {
     const text = new Y.Text();
-    edgeless.std
-      .get(EdgelessCRUDIdentifier)
-      .updateElement(shapeElement.id, { text });
+    crud.updateElement(updatedElement.id, { text });
   }
 
   const shapeEditor = new EdgelessShapeTextEditor();
@@ -280,6 +280,21 @@ export class EdgelessShapeTextEditor extends WithDisposable(ShadowlessElement) {
             this._unmount();
           }
         );
+
+        this.disposables.addFromEvent(
+          this.inlineEditorContainer,
+          'compositionupdate',
+          () => {
+            this._updateElementWH();
+          }
+        );
+        this.disposables.addFromEvent(
+          this.inlineEditorContainer,
+          'compositionend',
+          () => {
+            this._updateElementWH();
+          }
+        );
       })
       .catch(console.error);
 

blocksuite/affine/shared/src/utils/print-to-pdf.ts

@@ -49,6 +49,9 @@ export async function printToPdf(
                 --affine-background-primary: #fff !important;
                 --affine-background-secondary: #fff !important;
                 --affine-background-tertiary: #fff !important;
+                --affine-background-code-block: #f5f5f5 !important;
+                --affine-quote-color: #e3e3e3 !important;
+                --affine-border-color: #e3e3e3 !important;
               }
               body, [data-theme='dark'] {
                 color: #000 !important;

blocksuite/integration-test/src/__tests__/edgeless/mindmap.spec.ts

@@ -1,8 +1,9 @@
 import type { MindMapView } from '@blocksuite/affine/gfx/mindmap';
+import { mountShapeTextEditor } from '@blocksuite/affine/gfx/shape';
 import { LayoutType, type MindmapElementModel } from '@blocksuite/affine-model';
 import { Bound } from '@blocksuite/global/gfx';
 import type { GfxController } from '@blocksuite/std/gfx';
-import { beforeEach, describe, expect, test } from 'vitest';
+import { beforeEach, describe, expect, test, vi } from 'vitest';
 
 import { click, pointermove, wait } from '../utils/common.js';
 import { getDocRootBlock } from '../utils/edgeless.js';
@@ -36,6 +37,39 @@ describe('mindmap', () => {
     return cleanup;
   });
 
+  test('should update mindmap node editor size on compositionupdate', async () => {
+    const mindmapId = gfx.surface!.addElement({
+      type: 'mindmap',
+      children: {
+        text: 'root',
+      },
+    });
+    const mindmap = () => gfx.getElementById(mindmapId) as MindmapElementModel;
+
+    const root = getDocRootBlock(window.doc, window.editor, 'edgeless');
+    const rootNode = mindmap().tree.element;
+
+    mountShapeTextEditor(rootNode, root);
+    await wait();
+
+    const shapeEditor = root.querySelector('edgeless-shape-text-editor') as
+      | (HTMLElement & { inlineEditorContainer?: HTMLElement })
+      | null;
+
+    expect(shapeEditor).not.toBeNull();
+
+    const updateSpy = vi.spyOn(shapeEditor as any, '_updateElementWH');
+
+    const compositionUpdate = new CompositionEvent('compositionupdate', {
+      data: '拼',
+      bubbles: true,
+    });
+
+    shapeEditor!.inlineEditorContainer?.dispatchEvent(compositionUpdate);
+
+    expect(updateSpy).toHaveBeenCalled();
+  });
+
   test('delete the root node should remove all children', async () => {
     const tree = {
       text: 'root',

packages/backend/server/package.json

@@ -31,13 +31,13 @@
     "@google-cloud/opentelemetry-resource-util": "^3.0.0",
     "@nestjs-cls/transactional": "^3.2.0",
     "@nestjs-cls/transactional-adapter-prisma": "^1.3.4",
-    "@nestjs/apollo": "^13.2.4",
+    "@nestjs/apollo": "^13.0.4",
     "@nestjs/bullmq": "^11.0.4",
-    "@nestjs/common": "^11.1.16",
-    "@nestjs/core": "^11.1.16",
-    "@nestjs/graphql": "^13.2.4",
-    "@nestjs/platform-express": "^11.1.16",
-    "@nestjs/platform-socket.io": "^11.1.16",
+    "@nestjs/common": "^11.0.21",
+    "@nestjs/core": "^11.1.14",
+    "@nestjs/graphql": "^13.0.4",
+    "@nestjs/platform-express": "^11.1.14",
+    "@nestjs/platform-socket.io": "^11.1.14",
     "@nestjs/schedule": "^6.1.1",
     "@nestjs/throttler": "^6.5.0",
     "@nestjs/websockets": "^11.1.14",

packages/common/graphql/package.json

@@ -12,10 +12,10 @@
   },
   "sideEffects": false,
   "devDependencies": {
-    "@graphql-codegen/add": "^6.0.0",
-    "@graphql-codegen/cli": "^6.1.3",
-    "@graphql-codegen/typescript": "^5.0.9",
-    "@graphql-codegen/typescript-operations": "^5.0.9",
+    "@graphql-codegen/add": "^5.0.3",
+    "@graphql-codegen/cli": "^5.0.7",
+    "@graphql-codegen/typescript": "^4.1.6",
+    "@graphql-codegen/typescript-operations": "^4.6.1",
     "@types/lodash-es": "^4.17.12",
     "prettier": "^3.7.4",
     "vitest": "^4.0.18"