feat(core): block diff ui

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

## Summary by CodeRabbit

- **Bug Fixes**
- Subscription end dates are now correctly saved and updated for Stripe
subscriptions, ensuring accurate display and management of subscription
periods.

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

.docker/selfhost/schema.json

@@ -886,8 +886,8 @@
       "properties": {
         "enabled": {
           "type": "boolean",
-          "description": "Enable indexer plugin\n@default true\n@environment `AFFINE_INDEXER_ENABLED`",
-          "default": true
+          "description": "Enable indexer plugin\n@default false\n@environment `AFFINE_INDEXER_ENABLED`",
+          "default": false
         },
         "provider.type": {
           "type": "string",

.github/helm/affine/charts/doc/templates/deployment.yaml

@@ -95,11 +95,13 @@ spec:
               path: /info
               port: http
             initialDelaySeconds: {{ .Values.probe.initialDelaySeconds }}
+            timeoutSeconds: {{ .Values.probe.timeoutSeconds }}
           readinessProbe:
             httpGet:
               path: /info
               port: http
             initialDelaySeconds: {{ .Values.probe.initialDelaySeconds }}
+            timeoutSeconds: {{ .Values.probe.timeoutSeconds }}
           resources:
             {{- toYaml .Values.resources | nindent 12 }}
       {{- with .Values.nodeSelector }}

.github/helm/affine/charts/doc/values.yaml

@@ -36,6 +36,7 @@ resources:
 
 probe:
   initialDelaySeconds: 20
+  timeoutSeconds: 5
 
 nodeSelector: {}
 tolerations: []

.github/workflows/build-images.yml

@@ -113,6 +113,7 @@ jobs:
   build-server-native:
     name: Build Server native - ${{ matrix.targets.name }}
     runs-on: ubuntu-latest
+    environment: ${{ github.event.inputs.flavor }}
     strategy:
       fail-fast: false
       matrix:

.github/workflows/build-test.yml

@@ -20,6 +20,7 @@ env:
   COVERAGE: true
   MACOSX_DEPLOYMENT_TARGET: '10.13'
   DEPLOYMENT_TYPE: affine
+  AFFINE_INDEXER_ENABLED: true
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
@@ -826,7 +827,6 @@ jobs:
       - optimize_ci
     if: needs.optimize_ci.outputs.skip == 'false'
     env:
-      RUSTFLAGS: -D warnings
       CARGO_TERM_COLOR: always
     steps:
       - uses: actions/checkout@v4

Cargo.lock

@@ -453,12 +453,6 @@ dependencies = [
  "windows-targets 0.52.6",
 ]
 
-[[package]]
-name = "base64"
-version = "0.21.7"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9d297deb1925b89f2ccc13d7635fa0714f12c87adce1c75356b39ca9b7178567"
-
 [[package]]
 name = "base64"
 version = "0.22.1"
@@ -1263,7 +1257,7 @@ name = "docx-parser"
 version = "0.1.1"
 source = "git+https://github.com/toeverything/docx-parser#278ba3eeb29bbf1ee7958b02436e4402af61859b"
 dependencies = [
- "base64 0.22.1",
+ "base64",
  "clap",
  "docx-rust",
  "serde",
@@ -1826,7 +1820,7 @@ dependencies = [
  "js-sys",
  "log",
  "wasm-bindgen",
- "windows-core 0.57.0",
+ "windows-core 0.61.2",
 ]
 
 [[package]]
@@ -1838,18 +1832,6 @@ dependencies = [
  "cc",
 ]
 
-[[package]]
-name = "icu_collections"
-version = "1.5.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "db2fa452206ebee18c4b5c2274dbf1de17008e874b4dc4f0aea9d01ca79e4526"
-dependencies = [
- "displaydoc",
- "yoke 0.7.5",
- "zerofrom",
- "zerovec 0.10.4",
-]
-
 [[package]]
 name = "icu_collections"
 version = "2.0.0"
@@ -1858,9 +1840,25 @@ checksum = "200072f5d0e3614556f94a9930d5dc3e0662a652823904c3a75dc3b0af7fee47"
 dependencies = [
  "displaydoc",
  "potential_utf",
- "yoke 0.8.0",
+ "yoke",
  "zerofrom",
- "zerovec 0.11.2",
+ "zerovec",
+]
+
+[[package]]
+name = "icu_locale"
+version = "2.0.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6ae5921528335e91da1b6c695dbf1ec37df5ac13faa3f91e5640be93aa2fbefd"
+dependencies = [
+ "displaydoc",
+ "icu_collections",
+ "icu_locale_core",
+ "icu_locale_data",
+ "icu_provider",
+ "potential_utf",
+ "tinystr",
+ "zerovec",
 ]
 
 [[package]]
@@ -1870,23 +1868,17 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0cde2700ccaed3872079a65fb1a78f6c0a36c91570f28755dda67bc8f7d9f00a"
 dependencies = [
  "displaydoc",
- "litemap 0.8.0",
- "tinystr 0.8.1",
- "writeable 0.6.1",
- "zerovec 0.11.2",
+ "litemap",
+ "tinystr",
+ "writeable",
+ "zerovec",
 ]
 
 [[package]]
-name = "icu_locid"
-version = "1.5.0"
+name = "icu_locale_data"
+version = "2.0.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "13acbb8371917fc971be86fc8057c41a64b521c184808a698c02acc242dbf637"
-dependencies = [
- "displaydoc",
- "litemap 0.7.5",
- "tinystr 0.7.6",
- "writeable 0.5.5",
-]
+checksum = "4fdef0c124749d06a743c69e938350816554eb63ac979166590e2b4ee4252765"
 
 [[package]]
 name = "icu_normalizer"
@@ -1895,12 +1887,12 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "436880e8e18df4d7bbc06d58432329d6458cc84531f7ac5f024e93deadb37979"
 dependencies = [
  "displaydoc",
- "icu_collections 2.0.0",
+ "icu_collections",
  "icu_normalizer_data",
  "icu_properties",
- "icu_provider 2.0.0",
+ "icu_provider",
  "smallvec",
- "zerovec 0.11.2",
+ "zerovec",
 ]
 
 [[package]]
@@ -1916,13 +1908,13 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "016c619c1eeb94efb86809b015c58f479963de65bdb6253345c1a1276f22e32b"
 dependencies = [
  "displaydoc",
- "icu_collections 2.0.0",
+ "icu_collections",
  "icu_locale_core",
  "icu_properties_data",
- "icu_provider 2.0.0",
+ "icu_provider",
  "potential_utf",
  "zerotrie",
- "zerovec 0.11.2",
+ "zerovec",
 ]
 
 [[package]]
@@ -1931,23 +1923,6 @@ version = "2.0.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "298459143998310acd25ffe6810ed544932242d3f07083eee1084d83a71bd632"
 
-[[package]]
-name = "icu_provider"
-version = "1.5.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6ed421c8a8ef78d3e2dbc98a973be2f3770cb42b606e3ab18d6237c4dfde68d9"
-dependencies = [
- "displaydoc",
- "icu_locid",
- "icu_provider_macros",
- "stable_deref_trait",
- "tinystr 0.7.6",
- "writeable 0.5.5",
- "yoke 0.7.5",
- "zerofrom",
- "zerovec 0.10.4",
-]
-
 [[package]]
 name = "icu_provider"
 version = "2.0.0"
@@ -1957,46 +1932,37 @@ dependencies = [
  "displaydoc",
  "icu_locale_core",
  "stable_deref_trait",
- "tinystr 0.8.1",
- "writeable 0.6.1",
- "yoke 0.8.0",
+ "tinystr",
+ "writeable",
+ "yoke",
  "zerofrom",
  "zerotrie",
- "zerovec 0.11.2",
-]
-
-[[package]]
-name = "icu_provider_macros"
-version = "1.5.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1ec89e9337638ecdc08744df490b221a7399bf8d164eb52a665454e60e075ad6"
-dependencies = [
- "proc-macro2",
- "quote",
- "syn 2.0.101",
+ "zerovec",
 ]
 
 [[package]]
 name = "icu_segmenter"
-version = "1.5.0"
+version = "2.0.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a717725612346ffc2d7b42c94b820db6908048f39434504cb130e8b46256b0de"
+checksum = "e185fc13b6401c138cf40db12b863b35f5edf31b88192a545857b41aeaf7d3d3"
 dependencies = [
  "core_maths",
  "displaydoc",
- "icu_collections 1.5.0",
- "icu_locid",
- "icu_provider 1.5.0",
+ "icu_collections",
+ "icu_locale",
+ "icu_locale_core",
+ "icu_provider",
  "icu_segmenter_data",
+ "potential_utf",
  "utf8_iter",
- "zerovec 0.10.4",
+ "zerovec",
 ]
 
 [[package]]
 name = "icu_segmenter_data"
-version = "1.5.1"
+version = "2.0.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a1e52775179941363cc594e49ce99284d13d6948928d8e72c755f55e98caa1eb"
+checksum = "5360a2fbe97f617c4f8b944356dedb36d423f7da7f13c070995cf89e59f01220"
 
 [[package]]
 name = "idna"
@@ -2193,7 +2159,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "07033963ba89ebaf1584d767badaa2e8fcec21aedea6b8c0346d487d49c28667"
 dependencies = [
  "cfg-if",
- "windows-targets 0.48.5",
+ "windows-targets 0.52.6",
 ]
 
 [[package]]
@@ -2229,12 +2195,6 @@ version = "0.9.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "cd945864f07fe9f5371a27ad7b52a172b4b499999f1d97574c9fa68373937e12"
 
-[[package]]
-name = "litemap"
-version = "0.7.5"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "23fb14cb19457329c82206317a5663005a4d404783dc74f4252769b0d5f42856"
-
 [[package]]
 name = "litemap"
 version = "0.8.0"
@@ -2963,7 +2923,8 @@ version = "0.1.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e5a7c30837279ca13e7c867e9e40053bc68740f988cb07f7ca6df43cc734b585"
 dependencies = [
- "zerovec 0.11.2",
+ "serde",
+ "zerovec",
 ]
 
 [[package]]
@@ -3770,7 +3731,7 @@ version = "0.8.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "ee6798b1838b6a0f69c007c133b8df5866302197e404e8b6ee8ed3e3a5e68dc6"
 dependencies = [
- "base64 0.22.1",
+ "base64",
  "bytes",
  "chrono",
  "crc",
@@ -3846,7 +3807,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "aa003f0038df784eb8fecbbac13affe3da23b45194bd57dba231c8f48199c526"
 dependencies = [
  "atoi",
- "base64 0.22.1",
+ "base64",
  "bitflags 2.9.1",
  "byteorder",
  "bytes",
@@ -3889,7 +3850,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "db58fcd5a53cf07c184b154801ff91347e4c30d17a3562a635ff028ad5deda46"
 dependencies = [
  "atoi",
- "base64 0.22.1",
+ "base64",
  "bitflags 2.9.1",
  "byteorder",
  "chrono",
@@ -4300,14 +4261,14 @@ dependencies = [
 
 [[package]]
 name = "text-splitter"
-version = "0.25.1"
+version = "0.27.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d8130aecc3b7938ce3ea387d7615eca92bd4f702a5adc0548ba930a9c039dda4"
+checksum = "9f7e97f5863248f7d07896a1816bd4110cb1b0b122741f157d702121a270bf33"
 dependencies = [
  "ahash",
  "auto_enums",
  "either",
- "icu_provider 1.5.0",
+ "icu_provider",
  "icu_segmenter",
  "itertools 0.14.0",
  "memchr",
@@ -4378,29 +4339,19 @@ dependencies = [
 
 [[package]]
 name = "tiktoken-rs"
-version = "0.6.0"
+version = "0.7.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "44075987ee2486402f0808505dd65692163d243a337fc54363d49afac41087f6"
+checksum = "25563eeba904d770acf527e8b370fe9a5547bacd20ff84a0b6c3bc41288e5625"
 dependencies = [
  "anyhow",
- "base64 0.21.7",
+ "base64",
  "bstr",
  "fancy-regex",
  "lazy_static",
- "parking_lot",
  "regex",
  "rustc-hash 1.1.0",
 ]
 
-[[package]]
-name = "tinystr"
-version = "0.7.6"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9117f5d4db391c1cf6927e7bea3db74b9a1c1add8f7eda9ffd5364f40f57b82f"
-dependencies = [
- "displaydoc",
-]
-
 [[package]]
 name = "tinystr"
 version = "0.8.1"
@@ -4408,7 +4359,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "5d4f6d1145dcb577acf783d4e601bc1d76a13337bb54e6233add580b07344c8b"
 dependencies = [
  "displaydoc",
- "zerovec 0.11.2",
+ "zerovec",
 ]
 
 [[package]]
@@ -4590,9 +4541,9 @@ dependencies = [
 
 [[package]]
 name = "tree-sitter-c"
-version = "0.23.4"
+version = "0.24.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "afd2b1bf1585dc2ef6d69e87d01db8adb059006649dd5f96f31aa789ee6e9c71"
+checksum = "1a3aad8f0129083a59fe8596157552d2bb7148c492d44c21558d68ca1c722707"
 dependencies = [
  "cc",
  "tree-sitter-language",
@@ -5165,7 +5116,7 @@ version = "0.1.9"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "cf221c93e13a30d793f7645a0e7762c55d169dbb0a49671918a2319d289b10bb"
 dependencies = [
- "windows-sys 0.48.0",
+ "windows-sys 0.59.0",
 ]
 
 [[package]]
@@ -5504,12 +5455,6 @@ dependencies = [
  "bitflags 2.9.1",
 ]
 
-[[package]]
-name = "writeable"
-version = "0.5.5"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1e9df38ee2d2c3c5948ea468a8406ff0db0b29ae1ffde1bcf20ef305bcc95c51"
-
 [[package]]
 name = "writeable"
 version = "0.6.1"
@@ -5614,18 +5559,6 @@ dependencies = [
  "yrs 0.17.4",
 ]
 
-[[package]]
-name = "yoke"
-version = "0.7.5"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "120e6aef9aa629e3d4f52dc8cc43a015c7724194c97dfaf45180d2daf2b77f40"
-dependencies = [
- "serde",
- "stable_deref_trait",
- "yoke-derive 0.7.5",
- "zerofrom",
-]
-
 [[package]]
 name = "yoke"
 version = "0.8.0"
@@ -5634,22 +5567,10 @@ checksum = "5f41bb01b8226ef4bfd589436a297c53d118f65921786300e427be8d487695cc"
 dependencies = [
  "serde",
  "stable_deref_trait",
- "yoke-derive 0.8.0",
+ "yoke-derive",
  "zerofrom",
 ]
 
-[[package]]
-name = "yoke-derive"
-version = "0.7.5"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2380878cad4ac9aac1e2435f3eb4020e8374b5f13c296cb75b4620ff8e229154"
-dependencies = [
- "proc-macro2",
- "quote",
- "syn 2.0.101",
- "synstructure",
-]
-
 [[package]]
 name = "yoke-derive"
 version = "0.8.0"
@@ -5749,41 +5670,19 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "36f0bbd478583f79edad978b407914f61b2972f5af6fa089686016be8f9af595"
 dependencies = [
  "displaydoc",
- "yoke 0.8.0",
+ "yoke",
  "zerofrom",
 ]
 
-[[package]]
-name = "zerovec"
-version = "0.10.4"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "aa2b893d79df23bfb12d5461018d408ea19dfafe76c2c7ef6d4eba614f8ff079"
-dependencies = [
- "yoke 0.7.5",
- "zerofrom",
- "zerovec-derive 0.10.3",
-]
-
 [[package]]
 name = "zerovec"
 version = "0.11.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4a05eb080e015ba39cc9e23bbe5e7fb04d5fb040350f99f34e338d5fdd294428"
 dependencies = [
- "yoke 0.8.0",
+ "yoke",
  "zerofrom",
- "zerovec-derive 0.11.1",
-]
-
-[[package]]
-name = "zerovec-derive"
-version = "0.10.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6eafa6dfb17584ea3e2bd6e76e0cc15ad7af12b09abdd1ca55961bed9b1063c6"
-dependencies = [
- "proc-macro2",
- "quote",
- "syn 2.0.101",
+ "zerovec-derive",
 ]
 
 [[package]]

Cargo.toml

@@ -77,12 +77,12 @@ smol_str               = "0.3"
 sqlx                   = { version = "0.8", default-features = false, features = ["chrono", "macros", "migrate", "runtime-tokio", "sqlite", "tls-rustls"] }
 strum_macros           = "0.27.0"
 symphonia              = { version = "0.5", features = ["all", "opt-simd"] }
-text-splitter          = "0.25"
+text-splitter          = "0.27"
 thiserror              = "2"
-tiktoken-rs            = "0.6"
+tiktoken-rs            = "0.7"
 tokio                  = "1.45"
 tree-sitter            = { version = "0.25" }
-tree-sitter-c          = { version = "0.23" }
+tree-sitter-c          = { version = "0.24" }
 tree-sitter-c-sharp    = { version = "0.23" }
 tree-sitter-cpp        = { version = "0.23" }
 tree-sitter-go         = { version = "0.23" }

blocksuite/affine/blocks/attachment/src/attachment-block.ts

@@ -17,11 +17,15 @@ import {
   AttachmentBlockStyles,
 } from '@blocksuite/affine-model';
 import {
+  CitationProvider,
   DocModeProvider,
   FileSizeLimitProvider,
   TelemetryProvider,
 } from '@blocksuite/affine-shared/services';
-import { formatSize } from '@blocksuite/affine-shared/utils';
+import {
+  formatSize,
+  openSingleFileWith,
+} from '@blocksuite/affine-shared/utils';
 import {
   AttachmentIcon,
   ResetIcon,
@@ -30,17 +34,18 @@ import {
 } from '@blocksuite/icons/lit';
 import { BlockSelection } from '@blocksuite/std';
 import { nanoid, Slice } from '@blocksuite/store';
-import { computed, signal } from '@preact/signals-core';
+import { batch, computed, signal } from '@preact/signals-core';
 import { html, type TemplateResult } from 'lit';
 import { choose } from 'lit/directives/choose.js';
 import { type ClassInfo, classMap } from 'lit/directives/class-map.js';
 import { guard } from 'lit/directives/guard.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { when } from 'lit/directives/when.js';
+import { filter } from 'rxjs/operators';
 
 import { AttachmentEmbedProvider } from './embed';
 import { styles } from './styles';
-import { downloadAttachmentBlob, refreshData } from './utils';
+import { downloadAttachmentBlob, getFileType, refreshData } from './utils';
 
 type AttachmentResolvedStateInfo = ResolvedStateInfo & {
   kind?: TemplateResult;
@@ -79,8 +84,12 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
     return this.std.get(FileSizeLimitProvider).maxFileSize;
   }
 
+  get citationService() {
+    return this.std.get(CitationProvider);
+  }
+
   get isCitation() {
-    return !!this.model.props.footnoteIdentifier;
+    return this.citationService.isCitationModel(this.model);
   }
 
   convertTo = () => {
@@ -123,12 +132,50 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
 
   // Refreshes the embed component.
   reload = () => {
-    if (this.model.props.embed) {
-      this._refreshKey$.value = nanoid();
-      return;
-    }
+    batch(() => {
+      if (this.model.props.embed$.value) {
+        this._refreshKey$.value = nanoid();
+        return;
+      }
 
-    this.refreshData();
+      this.refreshData();
+    });
+  };
+
+  // Replaces the current attachment.
+  replace = async () => {
+    const state = this.resourceController.state$.peek();
+    if (state.uploading) return;
+
+    const file = await openSingleFileWith();
+    if (!file) return;
+
+    const sourceId = await this.std.store.blobSync.set(file);
+    const type = await getFileType(file);
+    const { name, size } = file;
+
+    let embed = this.model.props.embed$.value ?? false;
+
+    this.std.store.captureSync();
+    this.std.store.transact(() => {
+      this.std.store.updateBlock(this.blockId, {
+        name,
+        size,
+        type,
+        sourceId,
+        embed: false,
+      });
+
+      const provider = this.std.get(AttachmentEmbedProvider);
+      embed &&= provider.embedded(this.model);
+
+      if (embed) {
+        provider.convertTo(this.model);
+      }
+
+      // Reloads
+      this.reload();
+    });
   };
 
   private _selectBlock() {
@@ -139,6 +186,34 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
     selectionManager.setGroup('note', [blockSelection]);
   }
 
+  private readonly _trackCitationDeleteEvent = () => {
+    // Check citation delete event
+    this._disposables.add(
+      this.std.store.slots.blockUpdated
+        .pipe(
+          filter(payload => {
+            if (!payload.isLocal) return false;
+
+            const { flavour, id, type } = payload;
+            if (
+              type !== 'delete' ||
+              flavour !== this.model.flavour ||
+              id !== this.model.id
+            )
+              return false;
+
+            const { model } = payload;
+            if (!this.citationService.isCitationModel(model)) return false;
+
+            return true;
+          })
+        )
+        .subscribe(() => {
+          this.citationService.trackEvent('Delete');
+        })
+    );
+  };
+
   override connectedCallback() {
     super.connectedCallback();
 
@@ -162,6 +237,8 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
         });
       });
     }
+
+    this._trackCitationDeleteEvent();
   }
 
   override firstUpdated() {
@@ -367,7 +444,7 @@ export class AttachmentBlockComponent extends CaptionedBlockComponent<Attachment
 
   protected renderEmbedView = () => {
     const { model, blobUrl } = this;
-    if (!model.props.embed || !blobUrl) return null;
+    if (!model.props.embed$.value || !blobUrl) return null;
 
     const { std, _maxFileSize } = this;
     const provider = std.get(AttachmentEmbedProvider);

blocksuite/affine/blocks/attachment/src/components/rename-model.ts

@@ -1,6 +1,7 @@
 import { ConfirmIcon } from '@blocksuite/affine-components/icons';
 import { toast } from '@blocksuite/affine-components/toast';
 import type { AttachmentBlockModel } from '@blocksuite/affine-model';
+import { CitationProvider } from '@blocksuite/affine-shared/services';
 import type { EditorHost } from '@blocksuite/std';
 import { html } from 'lit';
 import { createRef, ref } from 'lit/directives/ref.js';
@@ -33,6 +34,7 @@ export const RenameModal = ({
 
   let fileName = includeExtension ? nameWithoutExtension : originalName;
   const extension = includeExtension ? originalExtension : '';
+  const citationService = editorHost.std.get(CitationProvider);
 
   const abort = () => abortController.abort();
   const onConfirm = () => {
@@ -44,6 +46,9 @@ export const RenameModal = ({
     model.store.updateBlock(model, {
       name: newFileName,
     });
+    if (citationService.isCitationModel(model)) {
+      citationService.trackEvent('Edit');
+    }
     abort();
   };
   const onInput = (e: InputEvent) => {

blocksuite/affine/blocks/attachment/src/configs/toolbar.ts

@@ -24,6 +24,7 @@ import {
   DownloadIcon,
   DuplicateIcon,
   EditIcon,
+  ReplaceIcon,
   ResetIcon,
 } from '@blocksuite/icons/lit';
 import { BlockFlavourIdentifier } from '@blocksuite/std';
@@ -139,27 +140,42 @@ export const attachmentViewDropdownMenu = {
       });
     };
 
-    return html`${keyed(
-      model,
-      html`<affine-view-dropdown-menu
-        @toggle=${onToggle}
-        .actions=${actions.value}
-        .context=${ctx}
-        .viewType$=${viewType$}
-      ></affine-view-dropdown-menu>`
-    )}`;
+    return html`<affine-view-dropdown-menu
+      @toggle=${onToggle}
+      .actions=${actions.value}
+      .context=${ctx}
+      .viewType$=${viewType$}
+    ></affine-view-dropdown-menu>`;
   },
 } as const satisfies ToolbarActionGroup<ToolbarAction>;
 
+const replaceAction = {
+  id: 'c.replace',
+  tooltip: 'Replace attachment',
+  icon: ReplaceIcon(),
+  disabled(ctx) {
+    const block = ctx.getCurrentBlockByType(AttachmentBlockComponent);
+    if (!block) return true;
+
+    const { downloading = false, uploading = false } =
+      block.resourceController.state$.value;
+    return downloading || uploading;
+  },
+  run(ctx) {
+    const block = ctx.getCurrentBlockByType(AttachmentBlockComponent);
+    block?.replace().catch(console.error);
+  },
+} as const satisfies ToolbarAction;
+
 const downloadAction = {
-  id: 'c.download',
+  id: 'd.download',
   tooltip: 'Download',
   icon: DownloadIcon(),
   run(ctx) {
     const block = ctx.getCurrentBlockByType(AttachmentBlockComponent);
     block?.download();
   },
-  when: ctx => {
+  when(ctx) {
     const model = ctx.getCurrentModelByType(AttachmentBlockModel);
     if (!model) return false;
     // Current citation attachment block does not support download
@@ -168,7 +184,7 @@ const downloadAction = {
 } as const satisfies ToolbarAction;
 
 const captionAction = {
-  id: 'd.caption',
+  id: 'e.caption',
   tooltip: 'Caption',
   icon: CaptionIcon(),
   run(ctx) {
@@ -221,6 +237,7 @@ const builtinToolbarConfig = {
       },
     },
     attachmentViewDropdownMenu,
+    replaceAction,
     downloadAction,
     captionAction,
     {
@@ -354,13 +371,17 @@ const builtinSurfaceToolbarConfig = {
         )}`;
       },
     } satisfies ToolbarActionGroup<ToolbarAction>,
+    {
+      ...replaceAction,
+      id: 'd.replace',
+    },
     {
       ...downloadAction,
-      id: 'd.download',
+      id: 'e.download',
     },
     {
       ...captionAction,
-      id: 'e.caption',
+      id: 'f.caption',
     },
   ],
   when: ctx => ctx.getSurfaceModelsByType(AttachmentBlockModel).length === 1,

blocksuite/affine/blocks/bookmark/src/bookmark-block.ts

@@ -8,6 +8,7 @@ import type {
 } from '@blocksuite/affine-model';
 import { ImageProxyService } from '@blocksuite/affine-shared/adapters';
 import {
+  CitationProvider,
   DocModeProvider,
   LinkPreviewServiceIdentifier,
 } from '@blocksuite/affine-shared/services';
@@ -18,6 +19,7 @@ import { html } from 'lit';
 import { property, query } from 'lit/decorators.js';
 import { type ClassInfo, classMap } from 'lit/directives/class-map.js';
 import { type StyleInfo, styleMap } from 'lit/directives/style-map.js';
+import { filter } from 'rxjs/operators';
 
 import { refreshBookmarkUrlData } from './utils.js';
 
@@ -114,11 +116,12 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc
     );
   };
 
+  get citationService() {
+    return this.std.get(CitationProvider);
+  }
+
   get isCitation() {
-    return (
-      !!this.model.props.footnoteIdentifier &&
-      this.model.props.style === 'citation'
-    );
+    return this.citationService.isCitationModel(this.model);
   }
 
   get imageProxyService() {
@@ -166,6 +169,31 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc
     ></bookmark-card>`;
   };
 
+  private readonly _trackCitationDeleteEvent = () => {
+    // Check citation delete event
+    this._disposables.add(
+      this.std.store.slots.blockUpdated
+        .pipe(
+          filter(payload => {
+            if (!payload.isLocal) return false;
+            const { flavour, id, type } = payload;
+            if (
+              type !== 'delete' ||
+              flavour !== this.model.flavour ||
+              id !== this.model.id
+            )
+              return false;
+            const { model } = payload;
+            if (!this.citationService.isCitationModel(model)) return false;
+            return true;
+          })
+        )
+        .subscribe(() => {
+          this.citationService.trackEvent('Delete');
+        })
+    );
+  };
+
   override connectedCallback() {
     super.connectedCallback();
 
@@ -203,6 +231,8 @@ export class BookmarkBlockComponent extends CaptionedBlockComponent<BookmarkBloc
         }
       })
     );
+
+    this._trackCitationDeleteEvent();
   }
 
   override disconnectedCallback(): void {

blocksuite/affine/blocks/code/src/code-block.ts

@@ -40,6 +40,16 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
 
   private _inlineRangeProvider: InlineRangeProvider | null = null;
 
+  private readonly _localPreview$ = signal<boolean | null>(null);
+
+  preview$: Signal<boolean> = computed(() => {
+    const modelPreview = !!this.model.props.preview$.value;
+    if (this.store.readonly) {
+      return this._localPreview$.value ?? modelPreview;
+    }
+    return modelPreview;
+  });
+
   highlightTokens$: Signal<ThemedToken[][]> = signal([]);
 
   languageName$: Signal<string> = computed(() => {
@@ -393,7 +403,7 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
         true) &&
       (this.model.props.lineNumber ?? true);
 
-    const preview = !!this.model.props.preview;
+    const preview = this.preview$.value;
     const previewContext = this.std.getOptional(
       CodeBlockPreviewIdentifier(this.model.props.language ?? '')
     );
@@ -461,6 +471,14 @@ export class CodeBlockComponent extends CaptionedBlockComponent<CodeBlockModel>
   override accessor useCaptionEditor = true;
 
   override accessor useZeroWidth = true;
+
+  setPreviewState(preview: boolean) {
+    if (this.store.readonly) {
+      this._localPreview$.value = preview;
+    } else {
+      this.store.updateBlock(this.model, { preview });
+    }
+  }
 }
 
 declare global {

blocksuite/affine/blocks/code/src/code-toolbar/components/preview-button.ts

@@ -58,11 +58,7 @@ export class PreviewButton extends WithDisposable(SignalWatcher(LitElement)) {
   `;
 
   private readonly _toggle = (value: boolean) => {
-    if (this.blockComponent.store.readonly) return;
-
-    this.blockComponent.store.updateBlock(this.blockComponent.model, {
-      preview: value,
-    });
+    this.blockComponent.setPreviewState(value);
 
     const std = this.blockComponent.std;
     const mode = std.getOptional(DocModeProvider)?.getEditorMode() ?? 'page';
@@ -77,7 +73,7 @@ export class PreviewButton extends WithDisposable(SignalWatcher(LitElement)) {
   };
 
   get preview() {
-    return !!this.blockComponent.model.props.preview$.value;
+    return this.blockComponent.preview$.value;
   }
 
   override render() {

blocksuite/affine/blocks/code/src/markdown.ts

@@ -0,0 +1,61 @@
+import {
+  type CodeBlockModel,
+  CodeBlockSchema,
+  ParagraphBlockModel,
+} from '@blocksuite/affine-model';
+import { focusTextModel } from '@blocksuite/affine-rich-text';
+import type { AffineTextAttributes } from '@blocksuite/affine-shared/types';
+import { matchModels } from '@blocksuite/affine-shared/utils';
+import type { BlockComponent } from '@blocksuite/std';
+import { InlineMarkdownExtension } from '@blocksuite/std/inline';
+
+export const CodeBlockMarkdownExtension =
+  InlineMarkdownExtension<AffineTextAttributes>({
+    name: 'code-block',
+    pattern: /^```([a-zA-Z0-9]*)\s$/,
+    action: ({ inlineEditor, inlineRange, prefixText, pattern }) => {
+      if (inlineEditor.yTextString.slice(0, inlineRange.index).includes('\n')) {
+        return;
+      }
+
+      const match = prefixText.match(pattern);
+      if (!match) return;
+
+      const language = match[1];
+
+      if (!inlineEditor.rootElement) return;
+      const blockComponent =
+        inlineEditor.rootElement.closest<BlockComponent>('[data-block-id]');
+      if (!blockComponent) return;
+
+      const { model, std, store } = blockComponent;
+
+      if (
+        matchModels(model, [ParagraphBlockModel]) &&
+        model.props.type === 'quote'
+      ) {
+        return;
+      }
+
+      const parent = store.getParent(model);
+      if (!parent) return;
+      const index = parent.children.indexOf(model);
+
+      store.captureSync();
+      const codeId = store.addBlock<CodeBlockModel>(
+        CodeBlockSchema.model.flavour,
+        { language },
+        parent,
+        index
+      );
+
+      if (model.text && model.text.length > prefixText.length) {
+        const text = model.text.clone();
+        store.addBlock('affine:paragraph', { text }, parent, index + 1);
+        text.delete(0, prefixText.length);
+      }
+      store.deleteBlock(model, { bringChildrenTo: parent });
+
+      focusTextModel(std, codeId);
+    },
+  });

blocksuite/affine/blocks/code/src/styles.ts

@@ -33,6 +33,10 @@ export const codeBlockStyles = css`
     grid-template-columns: auto minmax(0, 1fr);
   }
 
+  .affine-code-block-container.disable-line-numbers v-line {
+    grid-template-columns: unset;
+  }
+
   .affine-code-block-container div:has(> v-line) {
     display: grid;
   }

blocksuite/affine/blocks/code/src/view.ts

@@ -21,6 +21,7 @@ import { CodeKeymapExtension } from './code-keymap.js';
 import { AFFINE_CODE_TOOLBAR_WIDGET } from './code-toolbar/index.js';
 import { codeSlashMenuConfig } from './configs/slash-menu.js';
 import { effects } from './effects.js';
+import { CodeBlockMarkdownExtension } from './markdown.js';
 
 const codeToolbarWidget = WidgetViewExtension(
   'affine:code',
@@ -44,6 +45,7 @@ export class CodeBlockViewExtension extends ViewExtensionProvider {
       BlockViewExtension('affine:code', literal`affine-code`),
       SlashMenuConfigExtension('affine:code', codeSlashMenuConfig),
       CodeKeymapExtension,
+      CodeBlockMarkdownExtension,
       ...getCodeClipboardExtensions(),
     ]);
     context.register([

blocksuite/affine/blocks/database/src/properties/rich-text/cell-renderer.ts

@@ -331,7 +331,6 @@ export class RichTextCell extends BaseCellRenderer<Text, string> {
         this.inlineEditor$.value?.selectAll();
       }
     };
-    this.addEventListener('keydown', selectAll);
     this.disposables.addFromEvent(this, 'keydown', selectAll);
     this.disposables.add(
       effect(() => {

blocksuite/affine/blocks/database/src/properties/title/text.ts

@@ -209,10 +209,19 @@ export class HeaderAreaTextCell extends BaseCellRenderer<Text, string> {
       }
     };
 
-    this.addEventListener('keydown', selectAll);
     this.disposables.addFromEvent(this, 'keydown', selectAll);
   }
 
+  private readonly _handleKeyDown = (event: KeyboardEvent) => {
+    if (event.key !== 'Escape') {
+      if (event.key === 'Tab') {
+        event.preventDefault();
+        return;
+      }
+      event.stopPropagation();
+    }
+  };
+
   override firstUpdated(props: Map<string, unknown>) {
     super.firstUpdated(props);
     this.richText.value?.updateComplete
@@ -233,6 +242,12 @@ export class HeaderAreaTextCell extends BaseCellRenderer<Text, string> {
             'paste',
             this._onPaste
           );
+          const inlineEditor = this.inlineEditor;
+          if (inlineEditor) {
+            this.disposables.add(
+              inlineEditor.slots.keydown.subscribe(this._handleKeyDown)
+            );
+          }
         }
       })
       .catch(console.error);

blocksuite/affine/blocks/divider/package.json

@@ -13,6 +13,7 @@
     "@blocksuite/affine-components": "workspace:*",
     "@blocksuite/affine-ext-loader": "workspace:*",
     "@blocksuite/affine-model": "workspace:*",
+    "@blocksuite/affine-rich-text": "workspace:*",
     "@blocksuite/affine-shared": "workspace:*",
     "@blocksuite/global": "workspace:*",
     "@blocksuite/std": "workspace:*",

blocksuite/affine/blocks/divider/src/markdown.ts

@@ -0,0 +1,63 @@
+import {
+  type DividerBlockModel,
+  DividerBlockSchema,
+  ParagraphBlockModel,
+  ParagraphBlockSchema,
+} from '@blocksuite/affine-model';
+import { focusTextModel } from '@blocksuite/affine-rich-text';
+import type { AffineTextAttributes } from '@blocksuite/affine-shared/types';
+import { matchModels } from '@blocksuite/affine-shared/utils';
+import type { BlockComponent } from '@blocksuite/std';
+import { InlineMarkdownExtension } from '@blocksuite/std/inline';
+
+export const DividerMarkdownExtension =
+  InlineMarkdownExtension<AffineTextAttributes>({
+    name: 'divider',
+    pattern: /^(-{3,}|\*{3,}|_{3,})\s$/,
+    action: ({ inlineEditor, inlineRange }) => {
+      if (inlineEditor.yTextString.slice(0, inlineRange.index).includes('\n')) {
+        return;
+      }
+
+      if (!inlineEditor.rootElement) return;
+      const blockComponent =
+        inlineEditor.rootElement.closest<BlockComponent>('[data-block-id]');
+      if (!blockComponent) return;
+
+      const { model, std, store } = blockComponent;
+
+      if (
+        matchModels(model, [ParagraphBlockModel]) &&
+        model.props.type !== 'quote'
+      ) {
+        const parent = store.getParent(model);
+        if (!parent) return;
+        const index = parent.children.indexOf(model);
+
+        store.captureSync();
+        inlineEditor.deleteText({
+          index: 0,
+          length: inlineRange.index,
+        });
+        store.addBlock<DividerBlockModel>(
+          DividerBlockSchema.model.flavour,
+          {
+            children: model.children,
+          },
+          parent,
+          index
+        );
+
+        const nextBlock = parent.children.at(index + 1);
+        let id = nextBlock?.id;
+        if (!id) {
+          id = store.addBlock<ParagraphBlockModel>(
+            ParagraphBlockSchema.model.flavour,
+            {},
+            parent
+          );
+        }
+        focusTextModel(std, id);
+      }
+    },
+  });

blocksuite/affine/blocks/divider/src/view.ts

@@ -6,6 +6,7 @@ import { BlockViewExtension } from '@blocksuite/std';
 import { literal } from 'lit/static-html.js';
 
 import { effects } from './effects';
+import { DividerMarkdownExtension } from './markdown';
 
 export class DividerViewExtension extends ViewExtensionProvider {
   override name = 'affine-divider-block';
@@ -19,6 +20,7 @@ export class DividerViewExtension extends ViewExtensionProvider {
     super.setup(context);
     context.register([
       BlockViewExtension('affine:divider', literal`affine-divider`),
+      DividerMarkdownExtension,
     ]);
   }
 }

blocksuite/affine/blocks/divider/tsconfig.json

@@ -10,6 +10,7 @@
     { "path": "../../components" },
     { "path": "../../ext-loader" },
     { "path": "../../model" },
+    { "path": "../../rich-text" },
     { "path": "../../shared" },
     { "path": "../../../framework/global" },
     { "path": "../../../framework/std" },

blocksuite/affine/blocks/embed-doc/src/embed-linked-doc-block/embed-linked-doc-block.ts

@@ -17,6 +17,7 @@ import {
   REFERENCE_NODE,
 } from '@blocksuite/affine-shared/consts';
 import {
+  CitationProvider,
   DocDisplayMetaProvider,
   DocModeProvider,
   OpenDocExtensionIdentifier,
@@ -43,6 +44,7 @@ import { repeat } from 'lit/directives/repeat.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { when } from 'lit/directives/when.js';
 import throttle from 'lodash-es/throttle';
+import { filter } from 'rxjs/operators';
 import * as Y from 'yjs';
 
 import { renderLinkedDocInCard } from '../common/render-linked-doc';
@@ -254,11 +256,12 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
     return this.store.readonly;
   }
 
+  get citationService() {
+    return this.std.get(CitationProvider);
+  }
+
   get isCitation() {
-    return (
-      !!this.model.props.footnoteIdentifier &&
-      this.model.props.style === 'citation'
-    );
+    return this.citationService.isCitationModel(this.model);
   }
 
   private readonly _handleDoubleClick = (event: MouseEvent) => {
@@ -454,6 +457,31 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
     );
   };
 
+  private readonly _trackCitationDeleteEvent = () => {
+    // Check citation delete event
+    this._disposables.add(
+      this.std.store.slots.blockUpdated
+        .pipe(
+          filter(payload => {
+            if (!payload.isLocal) return false;
+            const { flavour, id, type } = payload;
+            if (
+              type !== 'delete' ||
+              flavour !== this.model.flavour ||
+              id !== this.model.id
+            )
+              return false;
+            const { model } = payload;
+            if (!this.citationService.isCitationModel(model)) return false;
+            return true;
+          })
+        )
+        .subscribe(() => {
+          this.citationService.trackEvent('Delete');
+        })
+    );
+  };
+
   override connectedCallback() {
     super.connectedCallback();
 
@@ -532,6 +560,8 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
         }
       })
     );
+
+    this._trackCitationDeleteEvent();
   }
 
   getInitialState(): {

blocksuite/affine/blocks/embed/src/embed-html-block/components/fullscreen-toolbar.ts

@@ -107,10 +107,10 @@ export class EmbedHtmlFullscreenToolbar extends LitElement {
     if (this._copied) return;
 
     this.embedHtml.std.clipboard
-      .writeToClipboard(items => {
-        items['text/plain'] = this.embedHtml.model.props.html ?? '';
-        return items;
-      })
+      .writeToClipboard(items => ({
+        ...items,
+        'text/plain': this.embedHtml.model.props.html ?? '',
+      }))
       .then(() => {
         this._copied = true;
         setTimeout(() => (this._copied = false), 1500);

blocksuite/affine/blocks/image/src/utils.ts

@@ -11,6 +11,7 @@ import {
   NativeClipboardProvider,
 } from '@blocksuite/affine-shared/services';
 import {
+  convertToPng,
   formatSize,
   getBlockProps,
   isInsidePageEditor,
@@ -111,28 +112,6 @@ export async function resetImageSize(
   block.store.updateBlock(model, props);
 }
 
-function convertToPng(blob: Blob): Promise<Blob | null> {
-  return new Promise(resolve => {
-    const reader = new FileReader();
-    reader.addEventListener('load', _ => {
-      const img = new Image();
-      img.onload = () => {
-        const c = document.createElement('canvas');
-        c.width = img.width;
-        c.height = img.height;
-        const ctx = c.getContext('2d');
-        if (!ctx) return;
-        ctx.drawImage(img, 0, 0);
-        c.toBlob(resolve, 'image/png');
-      };
-      img.onerror = () => resolve(null);
-      img.src = reader.result as string;
-    });
-    reader.addEventListener('error', () => resolve(null));
-    reader.readAsDataURL(blob);
-  });
-}
-
 export async function copyImageBlob(
   block: ImageBlockComponent | ImageEdgelessBlockComponent
 ) {

blocksuite/affine/blocks/list/src/list-keymap.ts

@@ -1,6 +1,5 @@
 import { textKeymap } from '@blocksuite/affine-inline-preset';
 import { ListBlockSchema } from '@blocksuite/affine-model';
-import { markdownInput } from '@blocksuite/affine-rich-text';
 import { getSelectedModelsCommand } from '@blocksuite/affine-shared/commands';
 import { IS_MAC } from '@blocksuite/global/env';
 import { KeymapExtension, TextSelection } from '@blocksuite/std';
@@ -125,20 +124,6 @@ export const ListKeymapExtension = KeymapExtension(
         ctx.get('keyboardState').raw.preventDefault();
         return true;
       },
-      Space: ctx => {
-        if (!markdownInput(std)) {
-          return;
-        }
-        ctx.get('keyboardState').raw.preventDefault();
-        return true;
-      },
-      'Shift-Space': ctx => {
-        if (!markdownInput(std)) {
-          return;
-        }
-        ctx.get('keyboardState').raw.preventDefault();
-        return true;
-      },
     };
   },
   {

blocksuite/affine/blocks/list/src/markdown.ts

@@ -0,0 +1,91 @@
+import {
+  type ListBlockModel,
+  ListBlockSchema,
+  type ListType,
+  ParagraphBlockModel,
+} from '@blocksuite/affine-model';
+import { focusTextModel } from '@blocksuite/affine-rich-text';
+import type { AffineTextAttributes } from '@blocksuite/affine-shared/types';
+import { matchModels, toNumberedList } from '@blocksuite/affine-shared/utils';
+import type { BlockComponent } from '@blocksuite/std';
+import { InlineMarkdownExtension } from '@blocksuite/std/inline';
+
+export const ListMarkdownExtension =
+  InlineMarkdownExtension<AffineTextAttributes>({
+    name: 'list',
+    // group 2: number
+    // group 3: bullet
+    // group 4: bullet
+    // group 5: todo
+    // group 6: todo checked
+    pattern: /^((\d+\.)|(-)|(\*)|(\[ ?\])|(\[x\]))\s$/,
+    action: ({ inlineEditor, pattern, inlineRange, prefixText }) => {
+      if (inlineEditor.yTextString.slice(0, inlineRange.index).includes('\n')) {
+        return;
+      }
+
+      const match = prefixText.match(pattern);
+      if (!match) return;
+
+      let type: ListType;
+
+      if (match[2]) {
+        type = 'numbered';
+      } else if (match[3] || match[4]) {
+        type = 'bulleted';
+      } else if (match[5] || match[6]) {
+        type = 'todo';
+      } else {
+        return;
+      }
+
+      const checked = match[6] !== undefined;
+
+      if (!inlineEditor.rootElement) return;
+      const blockComponent =
+        inlineEditor.rootElement.closest<BlockComponent>('[data-block-id]');
+      if (!blockComponent) return;
+
+      const { model, std, store } = blockComponent;
+      if (!matchModels(model, [ParagraphBlockModel])) return;
+
+      if (type !== 'numbered') {
+        const parent = store.getParent(model);
+        if (!parent) return;
+        const index = parent.children.indexOf(model);
+
+        store.captureSync();
+        inlineEditor.deleteText({
+          index: 0,
+          length: inlineRange.index,
+        });
+        const id = store.addBlock<ListBlockModel>(
+          ListBlockSchema.model.flavour,
+          {
+            type: type,
+            text: model.text?.clone(),
+            children: model.children,
+            ...(type === 'todo' ? { checked } : {}),
+          },
+          parent,
+          index
+        );
+        store.deleteBlock(model, { deleteChildren: false });
+        focusTextModel(std, id);
+      } else {
+        let order = parseInt(match[2]);
+        if (!Number.isInteger(order)) order = 1;
+
+        store.captureSync();
+        inlineEditor.deleteText({
+          index: 0,
+          length: inlineRange.index,
+        });
+
+        const id = toNumberedList(std, model, order);
+        if (!id) return;
+
+        focusTextModel(std, id);
+      }
+    },
+  });

blocksuite/affine/blocks/list/src/view.ts

@@ -7,6 +7,7 @@ import { literal } from 'lit/static-html.js';
 
 import { effects } from './effects.js';
 import { ListKeymapExtension, ListTextKeymapExtension } from './list-keymap.js';
+import { ListMarkdownExtension } from './markdown.js';
 
 export class ListViewExtension extends ViewExtensionProvider {
   override name = 'affine-list-block';
@@ -23,6 +24,7 @@ export class ListViewExtension extends ViewExtensionProvider {
       BlockViewExtension('affine:list', literal`affine-list`),
       ListKeymapExtension,
       ListTextKeymapExtension,
+      ListMarkdownExtension,
     ]);
   }
 }

blocksuite/affine/blocks/paragraph/src/markdown.ts

@@ -0,0 +1,74 @@
+import {
+  ListBlockModel,
+  ParagraphBlockModel,
+  ParagraphBlockSchema,
+  type ParagraphType,
+} from '@blocksuite/affine-model';
+import { focusTextModel } from '@blocksuite/affine-rich-text';
+import type { AffineTextAttributes } from '@blocksuite/affine-shared/types';
+import { matchModels } from '@blocksuite/affine-shared/utils';
+import type { BlockComponent } from '@blocksuite/std';
+import { InlineMarkdownExtension } from '@blocksuite/std/inline';
+
+export const ParagraphMarkdownExtension =
+  InlineMarkdownExtension<AffineTextAttributes>({
+    name: 'heading',
+    pattern: /^((#{1,6})|(>))\s$/,
+    action: ({ inlineEditor, pattern, inlineRange, prefixText }) => {
+      if (inlineEditor.yTextString.slice(0, inlineRange.index).includes('\n')) {
+        return;
+      }
+
+      const match = prefixText.match(pattern);
+      if (!match) return;
+
+      const type = (
+        match[2] ? `h${match[2].length}` : 'quote'
+      ) as ParagraphType;
+
+      if (!inlineEditor.rootElement) return;
+      const blockComponent =
+        inlineEditor.rootElement.closest<BlockComponent>('[data-block-id]');
+      if (!blockComponent) return;
+
+      const { model, std, store } = blockComponent;
+      if (
+        !matchModels(model, [ParagraphBlockModel]) &&
+        matchModels(model, [ListBlockModel])
+      ) {
+        const parent = store.getParent(model);
+        if (!parent) return;
+        const index = parent.children.indexOf(model);
+
+        store.captureSync();
+        inlineEditor.deleteText({
+          index: 0,
+          length: inlineRange.index,
+        });
+        store.deleteBlock(model, { deleteChildren: false });
+        const id = store.addBlock<ParagraphBlockModel>(
+          ParagraphBlockSchema.model.flavour,
+          {
+            type: type,
+            text: model.text?.clone(),
+            children: model.children,
+          },
+          parent,
+          index
+        );
+
+        focusTextModel(std, id);
+      } else if (
+        matchModels(model, [ParagraphBlockModel]) &&
+        model.props.type !== type
+      ) {
+        store.captureSync();
+        inlineEditor.deleteText({
+          index: 0,
+          length: inlineRange.index,
+        });
+        store.updateBlock(model, { type });
+        focusTextModel(std, model.id);
+      }
+    },
+  });

blocksuite/affine/blocks/paragraph/src/paragraph-block.ts

@@ -7,7 +7,10 @@ import {
   BLOCK_CHILDREN_CONTAINER_PADDING_LEFT,
   EDGELESS_TOP_CONTENTEDITABLE_SELECTOR,
 } from '@blocksuite/affine-shared/consts';
-import { DocModeProvider } from '@blocksuite/affine-shared/services';
+import {
+  CitationProvider,
+  DocModeProvider,
+} from '@blocksuite/affine-shared/services';
 import {
   calculateCollapsedSiblings,
   getNearestHeadingBefore,
@@ -25,6 +28,7 @@ import { query, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
+import { repeat } from 'lit/directives/repeat.js';
 
 import { ParagraphBlockConfigExtension } from './paragraph-block-config.js';
 import { paragraphBlockStyles } from './styles.js';
@@ -63,6 +67,10 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
       ?.getPlaceholder(this.model);
   }
 
+  get citationService() {
+    return this.std.get(CitationProvider);
+  }
+
   get attributeRenderer() {
     return this.inlineManager.getRenderer();
   }
@@ -94,6 +102,12 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
     return this.std.get(DefaultInlineManagerExtension.identifier);
   }
 
+  get hasCitationSiblings() {
+    return this.collapsedSiblings.some(sibling =>
+      this.citationService.isCitationModel(sibling)
+    );
+  }
+
   override get topContenteditableElement() {
     if (this.std.get(DocModeProvider).getEditorMode() === 'edgeless') {
       return this.closest<BlockComponent>(
@@ -214,6 +228,12 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
   }
 
   override renderBlock(): TemplateResult<1> {
+    const widgets = html`${repeat(
+      Object.entries(this.widgets),
+      ([id]) => id,
+      ([_, widget]) => widget
+    )}`;
+
     const { type$ } = this.model.props;
     const collapsed = this.store.readonly
       ? this._readonlyCollapsed
@@ -286,6 +306,13 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
                         collapsed: value,
                       });
                     }
+
+                    if (this.hasCitationSiblings) {
+                      this.citationService.trackEvent('Expand', {
+                        control: 'Source Button',
+                        type: value ? 'Hide' : 'Show',
+                      });
+                    }
                   }}
                 ></blocksuite-toggle-button>
               `
@@ -321,6 +348,7 @@ export class ParagraphBlockComponent extends CaptionedBlockComponent<ParagraphBl
         </div>
 
         ${children}
+        ${widgets}
       </div>
     `;
   }

blocksuite/affine/blocks/paragraph/src/paragraph-keymap.ts

@@ -7,7 +7,6 @@ import {
 import {
   focusTextModel,
   getInlineEditorByModel,
-  markdownInput,
 } from '@blocksuite/affine-rich-text';
 import {
   calculateCollapsedSiblings,
@@ -148,10 +147,6 @@ export const ParagraphKeymapExtension = KeymapExtension(
 
         raw.preventDefault();
 
-        if (markdownInput(std, model.id)) {
-          return true;
-        }
-
         if (model.props.type.startsWith('h') && model.props.collapsed) {
           const parent = store.getParent(model);
           if (!parent) return true;
@@ -199,20 +194,6 @@ export const ParagraphKeymapExtension = KeymapExtension(
         event.preventDefault();
         return true;
       },
-      Space: ctx => {
-        if (!markdownInput(std)) {
-          return;
-        }
-        ctx.get('keyboardState').raw.preventDefault();
-        return true;
-      },
-      'Shift-Space': ctx => {
-        if (!markdownInput(std)) {
-          return;
-        }
-        ctx.get('keyboardState').raw.preventDefault();
-        return true;
-      },
       Tab: ctx => {
         const [success] = std.command
           .chain()

blocksuite/affine/blocks/paragraph/src/utils/merge-with-prev.ts

@@ -20,6 +20,7 @@ import { EMBED_BLOCK_MODEL_LIST } from '@blocksuite/affine-shared/consts';
 import type { ExtendedModel } from '@blocksuite/affine-shared/types';
 import {
   focusTitle,
+  getDocTitleInlineEditor,
   getPrevContentBlock,
   matchModels,
 } from '@blocksuite/affine-shared/utils';
@@ -45,10 +46,6 @@ export function mergeWithPrev(editorHost: EditorHost, model: BlockModel) {
   const parent = doc.getParent(model);
   if (!parent) return false;
 
-  if (matchModels(parent, [EdgelessTextBlockModel])) {
-    return true;
-  }
-
   const prevBlock = getPrevContentBlock(editorHost, model);
   if (!prevBlock) {
     return handleNoPreviousSibling(editorHost, model);
@@ -123,36 +120,63 @@ function handleNoPreviousSibling(editorHost: EditorHost, model: ExtendedModel) {
   const parent = doc.getParent(model);
   if (!parent) return false;
 
-  if (matchModels(parent, [NoteBlockModel]) && parent.isPageBlock()) {
+  const focusFirstBlockStart = () => {
+    const firstBlock = parent.firstChild();
+    if (firstBlock) {
+      focusTextModel(editorHost.std, firstBlock.id, 0);
+    }
+  };
+
+  if (matchModels(parent, [NoteBlockModel])) {
+    const hasTitleEditor = getDocTitleInlineEditor(editorHost);
     const rootModel = model.store.root as RootBlockModel;
     const title = rootModel.props.title;
 
+    const shouldHandleTitle = parent.isPageBlock() && hasTitleEditor;
+
     doc.captureSync();
-    let textLength = 0;
-    if (text) {
-      textLength = text.length;
-      title.join(text);
+
+    if (shouldHandleTitle) {
+      let textLength = 0;
+      if (text) {
+        textLength = text.length;
+        title.join(text);
+      }
+      if (model.children.length > 0 || doc.getNext(model)) {
+        doc.deleteBlock(model, {
+          bringChildrenTo: parent,
+        });
+      }
+      // no other blocks, preserve a empty line
+      else {
+        text?.clear();
+      }
+      focusTitle(editorHost, title.length - textLength);
+      return true;
     }
 
     // Preserve at least one block to be able to focus on container click
-    if (doc.getNext(model) || model.children.length > 0) {
+    if (
+      text?.length === 0 &&
+      (model.children.length > 0 || doc.getNext(model))
+    ) {
       doc.deleteBlock(model, {
         bringChildrenTo: parent,
       });
-    } else {
-      text?.clear();
+      focusFirstBlockStart();
+      return true;
     }
-    focusTitle(editorHost, title.length - textLength);
-    return true;
   }
 
   if (
-    matchModels(parent, [EdgelessTextBlockModel]) ||
-    model.children.length > 0
+    matchModels(parent, [EdgelessTextBlockModel]) &&
+    text?.length === 0 &&
+    (model.children.length > 0 || doc.getNext(model))
   ) {
     doc.deleteBlock(model, {
       bringChildrenTo: parent,
     });
+    focusFirstBlockStart();
     return true;
   }
 

blocksuite/affine/blocks/paragraph/src/view.ts

@@ -2,9 +2,13 @@ import {
   type ViewExtensionContext,
   ViewExtensionProvider,
 } from '@blocksuite/affine-ext-loader';
+import { ParagraphBlockModel } from '@blocksuite/affine-model';
 import { BlockViewExtension, FlavourExtension } from '@blocksuite/std';
 import { literal } from 'lit/static-html.js';
+import { z } from 'zod';
 
+import { effects } from './effects';
+import { ParagraphMarkdownExtension } from './markdown.js';
 import { ParagraphBlockConfigExtension } from './paragraph-block-config.js';
 import {
   ParagraphKeymapExtension,
@@ -22,11 +26,6 @@ const placeholders = {
   quote: '',
 };
 
-import { ParagraphBlockModel } from '@blocksuite/affine-model';
-import { z } from 'zod';
-
-import { effects } from './effects';
-
 const optionsSchema = z.object({
   getPlaceholder: z.optional(
     z.function().args(z.instanceof(ParagraphBlockModel)).returns(z.string())
@@ -61,6 +60,7 @@ export class ParagraphViewExtension extends ViewExtensionProvider<
       ParagraphBlockConfigExtension({
         getPlaceholder,
       }),
+      ParagraphMarkdownExtension,
     ]);
   }
 }

blocksuite/affine/blocks/root/src/edgeless/clipboard/clipboard.ts

@@ -35,6 +35,7 @@ import {
   TelemetryProvider,
 } from '@blocksuite/affine-shared/services';
 import {
+  convertToPng,
   isInsidePageEditor,
   isTopLevelBlock,
   isUrlInClipboard,
@@ -67,7 +68,7 @@ import * as Y from 'yjs';
 
 import { PageClipboard } from '../../clipboard/index.js';
 import { getSortedCloneElements } from '../utils/clone-utils.js';
-import { isCanvasElementWithText } from '../utils/query.js';
+import { isCanvasElementWithText, isImageBlock } from '../utils/query.js';
 import { createElementsFromClipboardDataCommand } from './command.js';
 import {
   isPureFileInClipboard,
@@ -126,6 +127,49 @@ export class EdgelessClipboardController extends PageClipboard {
       return;
     }
 
+    // Only when an image is selected, it can be pasted normally to page mode.
+    if (elements.length === 1 && isImageBlock(elements[0])) {
+      const element = elements[0];
+      const sourceId = element.props.sourceId$.peek();
+      if (!sourceId) return;
+
+      await this.std.clipboard.writeToClipboard(async items => {
+        const job = this.std.store.getTransformer();
+        await job.assetsManager.readFromBlob(sourceId);
+
+        let blob = job.assetsManager.getAssets().get(sourceId) ?? null;
+        if (!blob) {
+          return items;
+        }
+
+        let type = blob.type;
+        let supported = false;
+
+        try {
+          supported = ClipboardItem?.supports(type) ?? false;
+        } catch (err) {
+          console.error(err);
+        }
+
+        // TODO(@fundon): when converting jpeg to png, image may become larger and exceed the limit.
+        if (!supported) {
+          type = 'image/png';
+          blob = await convertToPng(blob);
+        }
+
+        if (blob) {
+          return {
+            ...items,
+            [`${type}`]: blob,
+          };
+        }
+
+        return items;
+      });
+
+      return;
+    }
+
     await this.std.clipboard.writeToClipboard(async _items => {
       const data = await prepareClipboardData(elements, this.std);
       return {
@@ -562,6 +606,10 @@ export class EdgelessClipboardController extends PageClipboard {
   }
 
   private async _pasteTextContentAsNote(content: BlockSnapshot[] | string) {
+    if (content === '') {
+      return;
+    }
+
     const { x, y } = this.toolManager.lastMousePos$.peek();
 
     const noteProps = {

blocksuite/affine/blocks/root/src/edgeless/clipboard/utils.ts

@@ -69,37 +69,39 @@ export async function prepareClipboardData(
 
 export function isPureFileInClipboard(clipboardData: DataTransfer) {
   const types = clipboardData.types;
-  return (
-    (types.length === 1 && types[0] === 'Files') ||
-    (types.length === 2 &&
-      (types.includes('text/plain') || types.includes('text/html')) &&
-      types.includes('Files'))
-  );
+  const allowedTypes = new Set([
+    'Files',
+    'text/plain',
+    'text/html',
+    'application/x-moz-file',
+  ]);
+
+  return types.includes('Files') && types.every(type => allowedTypes.has(type));
 }
 
 export function tryGetSvgFromClipboard(clipboardData: DataTransfer) {
-  const types = clipboardData.types;
+  try {
+    const parser = new DOMParser();
+    const svgDoc = parser.parseFromString(
+      clipboardData.getData('text/plain'),
+      'image/svg+xml'
+    );
+    const svg = svgDoc.documentElement;
 
-  if (types.length === 1 && types[0] !== 'text/plain') {
+    if (svg.tagName !== 'svg' || !svg.hasAttribute('xmlns')) {
+      return null;
+    }
+    const svgContent = DOMPurify.sanitize(svgDoc.documentElement, {
+      USE_PROFILES: { svg: true },
+    });
+    const blob = new Blob([svgContent], { type: 'image/svg+xml' });
+    const file = new File([blob], 'pasted-image.svg', {
+      type: 'image/svg+xml',
+    });
+    return file;
+  } catch {
     return null;
   }
-
-  const parser = new DOMParser();
-  const svgDoc = parser.parseFromString(
-    clipboardData.getData('text/plain'),
-    'image/svg+xml'
-  );
-  const svg = svgDoc.documentElement;
-
-  if (svg.tagName !== 'svg' || !svg.hasAttribute('xmlns')) {
-    return null;
-  }
-  const svgContent = DOMPurify.sanitize(svgDoc.documentElement, {
-    USE_PROFILES: { svg: true },
-  });
-  const blob = new Blob([svgContent], { type: 'image/svg+xml' });
-  const file = new File([blob], 'pasted-image.svg', { type: 'image/svg+xml' });
-  return file;
 }
 
 export function edgelessElementsBoundFromRawData(

blocksuite/affine/blocks/table/src/table-cell.ts

@@ -647,6 +647,16 @@ export class TableCell extends SignalWatcher(
     return this.richText$.value?.inlineEditor;
   }
 
+  private readonly _handleKeyDown = (e: KeyboardEvent) => {
+    if (e.key !== 'Escape') {
+      if (e.key === 'Tab') {
+        e.preventDefault();
+        return;
+      }
+      e.stopPropagation();
+    }
+  };
+
   override connectedCallback() {
     super.connectedCallback();
     if (this.readonly) {
@@ -659,10 +669,7 @@ export class TableCell extends SignalWatcher(
         this.inlineEditor?.selectAll();
       }
     };
-    this.addEventListener('keydown', selectAll);
-    this.disposables.add(() => {
-      this.removeEventListener('keydown', selectAll);
-    });
+    this.disposables.addFromEvent(this, 'keydown', selectAll);
     this.disposables.addFromEvent(this, 'click', (e: MouseEvent) => {
       e.stopPropagation();
       requestAnimationFrame(() => {
@@ -679,6 +686,13 @@ export class TableCell extends SignalWatcher(
     }
     this.richText$.value?.updateComplete
       .then(() => {
+        const inlineEditor = this.inlineEditor;
+        if (inlineEditor) {
+          this.disposables.add(
+            inlineEditor.slots.keydown.subscribe(this._handleKeyDown)
+          );
+        }
+
         this.disposables.add(
           effect(() => {
             const richText = this.richText$.value;

blocksuite/affine/components/src/embed-card-modal/embed-card-edit-modal.ts

@@ -195,8 +195,7 @@ export class EmbedCardEditModal extends SignalWatcher(
 
     const description = this.description$.value.trim();
 
-    const props: AliasInfo = { title };
-    if (description) props.description = description;
+    const props: AliasInfo = { title, description };
 
     this.onSave?.(std, blockComponent, props);
 

blocksuite/affine/data-view/src/core/group-by/trait.ts

@@ -112,7 +112,10 @@ export class GroupTrait {
       return;
     }
     const { staticMap, groupInfo } = staticInfo;
-    const groupMap: Record<string, Group> = { ...staticMap };
+    const groupMap: Record<string, Group> = {};
+    Object.entries(staticMap).forEach(([key, group]) => {
+      groupMap[key] = new Group(key, group.value, groupInfo, this);
+    });
     this.view.rows$.value.forEach(row => {
       const value = this.view.cellGetOrCreate(row.rowId, groupInfo.property.id)
         .jsonValue$.value;
@@ -182,6 +185,7 @@ export class GroupTrait {
   ) {}
 
   addToGroup(rowId: string, key: string) {
+    this.view.lockRows(false);
     const groupMap = this.groupDataMap$.value;
     const groupInfo = this.groupInfo$.value;
     if (!groupMap || !groupInfo) {
@@ -254,6 +258,7 @@ export class GroupTrait {
     toGroupKey: string,
     position: InsertToPosition
   ) {
+    this.view.lockRows(false);
     const groupMap = this.groupDataMap$.value;
     if (!groupMap) {
       return;
@@ -290,6 +295,7 @@ export class GroupTrait {
   }
 
   moveGroupTo(groupKey: string, position: InsertToPosition) {
+    this.view.lockRows(false);
     const groups = this.groupsDataList$.value;
     if (!groups) {
       return;
@@ -305,6 +311,7 @@ export class GroupTrait {
   }
 
   removeFromGroup(rowId: string, key: string) {
+    this.view.lockRows(false);
     const groupMap = this.groupDataMap$.value;
     if (!groupMap) {
       return;
@@ -323,6 +330,7 @@ export class GroupTrait {
   }
 
   updateValue(rows: string[], value: unknown) {
+    this.view.lockRows(false);
     const propertyId = this.property$.value?.id;
     if (!propertyId) {
       return;

blocksuite/affine/data-view/src/core/view-manager/single-view.ts

@@ -128,6 +128,7 @@ export abstract class SingleViewBase<
   );
 
   rowsDelete(rows: string[]): void {
+    this.lockRows(false);
     this.dataSource.rowDelete(rows);
   }
 
@@ -258,6 +259,7 @@ export abstract class SingleViewBase<
   abstract propertyGetOrCreate(propertyId: string): Property;
 
   rowAdd(insertPosition: InsertToPosition | number): string {
+    this.lockRows(false);
     return this.dataSource.rowAdd(insertPosition);
   }
 

blocksuite/affine/data-view/src/view-presets/kanban/mobile/group.ts

@@ -61,10 +61,12 @@ export class MobileKanbanGroup extends SignalWatcher(
 
   private readonly clickAddCard = () => {
     this.view.addCard('end', this.group.key);
+    this.requestUpdate();
   };
 
   private readonly clickAddCardInStart = () => {
     this.view.addCard('start', this.group.key);
+    this.requestUpdate();
   };
 
   private readonly clickGroupOptions = (e: MouseEvent) => {
@@ -79,12 +81,14 @@ export class MobileKanbanGroup extends SignalWatcher(
               this.group.rows.forEach(row => {
                 this.group.manager.removeFromGroup(row.rowId, this.group.key);
               });
+              this.requestUpdate();
             },
           }),
           menu.action({
             name: 'Delete Cards',
             select: () => {
               this.view.rowsDelete(this.group.rows.map(row => row.rowId));
+              this.requestUpdate();
             },
           }),
         ],

blocksuite/affine/data-view/src/view-presets/kanban/mobile/kanban-view-ui-logic.ts

@@ -66,7 +66,9 @@ export class MobileKanbanViewUILogic extends DataViewUILogicBase<
 
   addRow = (position: InsertToPosition) => {
     if (this.readonly) return;
-    return this.view.rowAdd(position);
+    const id = this.view.rowAdd(position);
+    this.ui$.value?.requestUpdate();
+    return id;
   };
 
   focusFirstCell = () => {};

blocksuite/affine/data-view/src/view-presets/kanban/mobile/menu.ts

@@ -83,6 +83,7 @@ export const popCardMenu = (
               { before: true, id: cardId },
               groupKey
             );
+            kanbanViewLogic.ui$.value?.requestUpdate();
           },
         }),
         menu.action({
@@ -97,6 +98,7 @@ export const popCardMenu = (
               { before: false, id: cardId },
               groupKey
             );
+            kanbanViewLogic.ui$.value?.requestUpdate();
           },
         }),
       ],
@@ -111,6 +113,7 @@ export const popCardMenu = (
           prefix: DeleteIcon(),
           select: () => {
             kanbanViewLogic.view.rowsDelete([cardId]);
+            kanbanViewLogic.ui$.value?.requestUpdate();
           },
         }),
       ],

blocksuite/affine/data-view/src/view-presets/kanban/pc/controller/selection.ts

@@ -128,6 +128,7 @@ export class KanbanSelectionController implements ReactiveController {
     if (selection.selectionType === 'card') {
       this.view.rowsDelete(selection.cards.map(v => v.cardId));
       this.selection = undefined;
+      this.logic.ui$.value?.requestUpdate();
     }
   }
 

blocksuite/affine/data-view/src/view-presets/kanban/pc/group.ts

@@ -110,6 +110,7 @@ export class KanbanGroup extends SignalWatcher(
         isEditing: true,
       };
     });
+    this.requestUpdate();
   };
 
   private readonly clickAddCardInStart = () => {
@@ -127,6 +128,7 @@ export class KanbanGroup extends SignalWatcher(
         isEditing: true,
       };
     });
+    this.requestUpdate();
   };
 
   private readonly clickGroupOptions = (e: MouseEvent) => {
@@ -139,12 +141,14 @@ export class KanbanGroup extends SignalWatcher(
           this.group.rows.forEach(row => {
             this.group.manager.removeFromGroup(row.rowId, this.group.key);
           });
+          this.requestUpdate();
         },
       }),
       menu.action({
         name: 'Delete Cards',
         select: () => {
           this.view.rowsDelete(this.group.rows.map(row => row.rowId));
+          this.requestUpdate();
         },
       }),
     ]);

blocksuite/affine/data-view/src/view-presets/kanban/pc/kanban-view-ui-logic.ts

@@ -73,6 +73,7 @@ export class KanbanViewUILogic extends DataViewUILogicBase<
         rowId,
       });
     }
+    this.ui$.value?.requestUpdate();
     return rowId;
   };
 

blocksuite/affine/data-view/src/view-presets/table/mobile/group.ts

@@ -51,10 +51,12 @@ export class MobileTableGroup extends SignalWatcher(
 
   private readonly clickAddRow = () => {
     this.view.rowAdd('end', this.group?.key);
+    this.requestUpdate();
   };
 
   private readonly clickAddRowInStart = () => {
     this.view.rowAdd('start', this.group?.key);
+    this.requestUpdate();
   };
 
   private readonly clickGroupOptions = (e: MouseEvent) => {
@@ -77,6 +79,7 @@ export class MobileTableGroup extends SignalWatcher(
         name: 'Delete Cards',
         select: () => {
           this.view.rowsDelete(group.rows.map(row => row.rowId));
+          this.requestUpdate();
         },
       }),
     ]);

blocksuite/affine/data-view/src/view-presets/table/mobile/menu.ts

@@ -38,6 +38,7 @@ export const popMobileRowMenu = (
           prefix: DeleteIcon(),
           select: () => {
             view.rowsDelete([rowId]);
+            tableViewLogic.ui$.value?.requestUpdate();
           },
         }),
       ],

blocksuite/affine/data-view/src/view-presets/table/pc-virtual/controller/clipboard.ts

@@ -44,6 +44,7 @@ export class TableClipboardController implements ReactiveController {
       }
       if (deleteRows.length) {
         this.logic.view.rowsDelete(deleteRows);
+        this.logic.ui$.value?.requestUpdate();
       }
     }
     this.clipboard
@@ -79,6 +80,14 @@ export class TableClipboardController implements ReactiveController {
     const event = _context.get('clipboardState').raw;
     event.stopPropagation();
 
+    const active = document.activeElement as HTMLElement | null;
+    if (
+      active &&
+      (active.tagName === 'INPUT' || active.tagName === 'TEXTAREA')
+    ) {
+      return true;
+    }
+
     const clipboardData = event.clipboardData;
     if (!clipboardData) return;
 

blocksuite/affine/data-view/src/view-presets/table/pc-virtual/controller/hotkeys.ts

@@ -30,6 +30,7 @@ export class TableHotkeysController implements ReactiveController {
             const rows = TableViewRowSelection.rowsIds(selection);
             this.selectionController.selection = undefined;
             this.logic.view.rowsDelete(rows);
+            this.logic.ui$.value?.requestUpdate();
             return;
           }
           const {

blocksuite/affine/data-view/src/view-presets/table/pc-virtual/controller/selection.ts

@@ -376,6 +376,7 @@ export class TableSelectionController implements ReactiveController {
   deleteRow(rowId: string) {
     this.view.rowsDelete([rowId]);
     this.focusToCell('up');
+    this.logic.ui$.value?.requestUpdate();
   }
 
   focusFirstCell() {

blocksuite/affine/data-view/src/view-presets/table/pc-virtual/group/bottom/group-footer.ts

@@ -45,6 +45,7 @@ export class TableGroupFooter extends WithDisposable(ShadowlessElement) {
   private readonly clickAddRow = () => {
     const group = this.group$.value;
     const rowId = this.tableViewManager.rowAdd('end', group?.key);
+    this.requestUpdate();
 
     requestAnimationFrame(() => {
       const rowIndex = this.selectionController.getRow(group?.key, rowId)

blocksuite/affine/data-view/src/view-presets/table/pc-virtual/group/top/group-header.ts

@@ -58,6 +58,7 @@ export class TableGroupHeader extends SignalWatcher(
       return;
     }
     this.tableViewManager.rowAdd('start', group.key);
+    this.requestUpdate();
     const selectionController = this.selectionController;
     selectionController.selection = undefined;
     requestAnimationFrame(() => {
@@ -95,6 +96,7 @@ export class TableGroupHeader extends SignalWatcher(
         name: 'Delete Cards',
         select: () => {
           this.tableViewManager.rowsDelete(group.rows.map(row => row.rowId));
+          this.requestUpdate();
         },
       }),
     ]);

blocksuite/affine/data-view/src/view-presets/table/pc-virtual/row/menu.ts

@@ -71,6 +71,7 @@ export const popRowMenu = (
             prefix: DeleteIcon(),
             select: () => {
               selectionController.view.rowsDelete(rows);
+              selectionController.logic.ui$.value?.requestUpdate();
             },
           }),
         ],

blocksuite/affine/data-view/src/view-presets/table/pc/controller/clipboard.ts

@@ -43,6 +43,7 @@ export class TableClipboardController implements ReactiveController {
       }
       if (deleteRows.length) {
         this.logic.view.rowsDelete(deleteRows);
+        this.logic.ui$.value?.requestUpdate();
       }
     }
     this.clipboard
@@ -78,6 +79,14 @@ export class TableClipboardController implements ReactiveController {
     const event = _context.get('clipboardState').raw;
     event.stopPropagation();
 
+    const active = document.activeElement as HTMLElement | null;
+    if (
+      active &&
+      (active.tagName === 'INPUT' || active.tagName === 'TEXTAREA')
+    ) {
+      return true;
+    }
+
     const clipboardData = event.clipboardData;
     if (!clipboardData) return;
 

blocksuite/affine/data-view/src/view-presets/table/pc/controller/hotkeys.ts

@@ -28,6 +28,7 @@ export class TableHotkeysController implements ReactiveController {
             const rows = TableViewRowSelection.rowsIds(selection);
             this.selectionController.selection = undefined;
             this.logic.view.rowsDelete(rows);
+            this.logic.ui$.value?.requestUpdate();
             return;
           }
           const {

blocksuite/affine/data-view/src/view-presets/table/pc/controller/selection.ts

@@ -351,6 +351,7 @@ export class TableSelectionController implements ReactiveController {
   deleteRow(rowId: string) {
     this.view.rowsDelete([rowId]);
     this.focusToCell('up');
+    this.logic.ui$.value?.requestUpdate();
   }
 
   focusFirstCell() {

blocksuite/affine/data-view/src/view-presets/table/pc/group.ts

@@ -83,6 +83,7 @@ export class TableGroup extends SignalWatcher(
         },
         isEditing: true,
       });
+      this.requestUpdate();
     });
   };
 
@@ -102,6 +103,7 @@ export class TableGroup extends SignalWatcher(
         },
         isEditing: true,
       });
+      this.requestUpdate();
     });
   };
 
@@ -125,6 +127,7 @@ export class TableGroup extends SignalWatcher(
         name: 'Delete Cards',
         select: () => {
           this.view.rowsDelete(group.rows.map(row => row.rowId));
+          this.requestUpdate();
         },
       }),
     ]);

blocksuite/affine/data-view/src/view-presets/table/pc/menu.ts

@@ -71,6 +71,7 @@ export const popRowMenu = (
             prefix: DeleteIcon(),
             select: () => {
               selectionController.view.rowsDelete(rows);
+              selectionController.logic.ui$.value?.requestUpdate();
             },
           }),
         ],

blocksuite/affine/foundation/src/view.ts

@@ -9,6 +9,7 @@ import {
 } from '@blocksuite/affine-ext-loader';
 import {
   AutoClearSelectionService,
+  CitationService,
   DefaultOpenDocExtension,
   DNDAPIExtension,
   DocDisplayMetaService,
@@ -76,6 +77,7 @@ export class FoundationViewExtension extends ViewExtensionProvider<FoundationVie
       FileSizeLimitService,
       LinkPreviewCache,
       LinkPreviewService,
+      CitationService,
     ]);
     context.register(clipboardConfigs);
     if (this.isEdgeless(context.scope)) {

blocksuite/affine/inlines/footnote/src/footnote-node/footnote-node.ts

@@ -1,6 +1,7 @@
 import { HoverController } from '@blocksuite/affine-components/hover';
 import { PeekViewProvider } from '@blocksuite/affine-components/peek';
 import type { FootNote } from '@blocksuite/affine-model';
+import { CitationProvider } from '@blocksuite/affine-shared/services';
 import { unsafeCSSVarV2 } from '@blocksuite/affine-shared/theme';
 import type { AffineTextAttributes } from '@blocksuite/affine-shared/types';
 import { WithDisposable } from '@blocksuite/global/lit';
@@ -117,6 +118,10 @@ export class AffineFootnoteNode extends WithDisposable(ShadowlessElement) {
     return this.std.store.readonly;
   }
 
+  get citationService() {
+    return this.std.get(CitationProvider);
+  }
+
   onFootnoteClick = () => {
     if (!this.footnote) {
       return;
@@ -215,6 +220,10 @@ export class AffineFootnoteNode extends WithDisposable(ShadowlessElement) {
         return null;
       }
 
+      this.citationService.trackEvent('Hover', {
+        control: 'Source Footnote',
+      });
+
       return {
         template: this._FootNotePopup(footnote, abortController),
         container: this.std.host,

blocksuite/affine/inlines/latex/src/markdown.ts

@@ -10,7 +10,7 @@ export const LatexExtension = InlineMarkdownExtension<AffineTextAttributes>({
   name: 'latex',
 
   pattern:
-    /(?:\$\$)(?<content>[^$]+)(?:\$\$)$|(?<blockPrefix>\$\$\$\$)|(?<inlinePrefix>\$\$)$/g,
+    /(?:\$\$)(?<content>[^$]+)(?:\$\$)\s$|(?<blockPrefix>\$\$\$\$)\s$|(?<inlinePrefix>\$\$)\s$/g,
   action: ({ inlineEditor, prefixText, inlineRange, pattern, undoManager }) => {
     const match = pattern.exec(prefixText);
     if (!match || !match.groups) return;
@@ -33,22 +33,10 @@ export const LatexExtension = InlineMarkdownExtension<AffineTextAttributes>({
     const ifEdgelessText = blockComponent.closest('affine-edgeless-text');
 
     if (blockPrefix === '$$$$') {
-      inlineEditor.insertText(
-        {
-          index: inlineRange.index,
-          length: 0,
-        },
-        ' '
-      );
-      inlineEditor.setInlineRange({
-        index: inlineRange.index + 1,
-        length: 0,
-      });
-
       undoManager.stopCapturing();
 
       inlineEditor.deleteText({
-        index: inlineRange.index - 4,
+        index: inlineRange.index - 5,
         length: 5,
       });
 
@@ -88,34 +76,22 @@ export const LatexExtension = InlineMarkdownExtension<AffineTextAttributes>({
     }
 
     if (inlinePrefix === '$$') {
-      inlineEditor.insertText(
-        {
-          index: inlineRange.index,
-          length: 0,
-        },
-        ' '
-      );
-      inlineEditor.setInlineRange({
-        index: inlineRange.index + 1,
-        length: 0,
-      });
-
       undoManager.stopCapturing();
 
       inlineEditor.deleteText({
-        index: inlineRange.index - 2,
+        index: inlineRange.index - 3,
         length: 3,
       });
       inlineEditor.insertText(
         {
-          index: inlineRange.index - 2,
+          index: inlineRange.index - 3,
           length: 0,
         },
         ' '
       );
       inlineEditor.formatText(
         {
-          index: inlineRange.index - 2,
+          index: inlineRange.index - 3,
           length: 1,
         },
         {
@@ -129,7 +105,7 @@ export const LatexExtension = InlineMarkdownExtension<AffineTextAttributes>({
           await inlineEditor.waitForUpdate();
 
           const textPoint = inlineEditor.getTextPoint(
-            inlineRange.index - 2 + 1
+            inlineRange.index - 3 + 1
           );
           if (!textPoint) return;
 
@@ -159,21 +135,9 @@ export const LatexExtension = InlineMarkdownExtension<AffineTextAttributes>({
 
     if (!content || content.length === 0) return;
 
-    inlineEditor.insertText(
-      {
-        index: inlineRange.index,
-        length: 0,
-      },
-      ' '
-    );
-    inlineEditor.setInlineRange({
-      index: inlineRange.index + 1,
-      length: 0,
-    });
-
     undoManager.stopCapturing();
 
-    const startIndex = inlineRange.index - 2 - content.length - 2;
+    const startIndex = inlineRange.index - 1 - 2 - content.length - 2;
     inlineEditor.deleteText({
       index: startIndex,
       length: 2 + content.length + 2 + 1,

blocksuite/affine/inlines/link/src/markdown.ts

@@ -3,27 +3,18 @@ import { InlineMarkdownExtension } from '@blocksuite/std/inline';
 
 export const LinkExtension = InlineMarkdownExtension<AffineTextAttributes>({
   name: 'link',
-  pattern: /.*\[(.+?)\]\((.+?)\)$/,
+  pattern: /.*\[(.+?)\]\((.+?)\)\s$/,
   action: ({ inlineEditor, prefixText, inlineRange, pattern, undoManager }) => {
     const match = prefixText.match(pattern);
     if (!match) return;
 
     const linkText = match[1];
     const linkUrl = match[2];
-    const annotatedText = match[0].slice(-linkText.length - linkUrl.length - 4);
-    const startIndex = inlineRange.index - annotatedText.length;
-
-    inlineEditor.insertText(
-      {
-        index: inlineRange.index,
-        length: 0,
-      },
-      ' '
+    const annotatedText = match[0].slice(
+      -(linkText.length + linkUrl.length + 4 + 1),
+      -1
     );
-    inlineEditor.setInlineRange({
-      index: inlineRange.index + 1,
-      length: 0,
-    });
+    const startIndex = inlineRange.index - annotatedText.length - 1;
 
     undoManager.stopCapturing();
 

blocksuite/affine/inlines/preset/src/inline-spec.ts

@@ -59,7 +59,7 @@ export const StrikeInlineSpecExtension =
 
 export const CodeInlineSpecExtension =
   InlineSpecExtension<AffineTextAttributes>({
-    name: 'code',
+    name: 'inline-code',
     schema: z.literal(true).optional().nullable().catch(undefined),
     match: delta => {
       return !!delta.attributes?.code;

blocksuite/affine/inlines/preset/src/markdown.ts

@@ -13,7 +13,7 @@ import type { ExtensionType } from '@blocksuite/store';
 export const BoldItalicMarkdown = InlineMarkdownExtension<AffineTextAttributes>(
   {
     name: 'bolditalic',
-    pattern: /.*\*{3}([^\s*][^*]*[^\s*])\*{3}$|.*\*{3}([^\s*])\*{3}$/,
+    pattern: /.*\*{3}([^\s*][^*]*[^\s*])\*{3}\s$|.*\*{3}([^\s*])\*{3}\s$/,
     action: ({
       inlineEditor,
       prefixText,
@@ -25,20 +25,11 @@ export const BoldItalicMarkdown = InlineMarkdownExtension<AffineTextAttributes>(
       if (!match) return;
 
       const targetText = match[1] ?? match[2];
-      const annotatedText = match[0].slice(-targetText.length - 3 * 2);
-      const startIndex = inlineRange.index - annotatedText.length;
-
-      inlineEditor.insertText(
-        {
-          index: startIndex + annotatedText.length,
-          length: 0,
-        },
-        ' '
+      const annotatedText = match[0].slice(
+        -(targetText.length + 3 * 2 + 1),
+        -1
       );
-      inlineEditor.setInlineRange({
-        index: startIndex + annotatedText.length + 1,
-        length: 0,
-      });
+      const startIndex = inlineRange.index - annotatedText.length - 1;
 
       undoManager.stopCapturing();
 
@@ -54,18 +45,13 @@ export const BoldItalicMarkdown = InlineMarkdownExtension<AffineTextAttributes>(
       );
 
       inlineEditor.deleteText({
-        index: startIndex + annotatedText.length,
-        length: 1,
-      });
-      inlineEditor.deleteText({
-        index: startIndex + annotatedText.length - 3,
-        length: 3,
+        index: inlineRange.index - 4,
+        length: 4,
       });
       inlineEditor.deleteText({
         index: startIndex,
         length: 3,
       });
-
       inlineEditor.setInlineRange({
         index: startIndex + annotatedText.length - 6,
         length: 0,
@@ -76,26 +62,14 @@ export const BoldItalicMarkdown = InlineMarkdownExtension<AffineTextAttributes>(
 
 export const BoldMarkdown = InlineMarkdownExtension<AffineTextAttributes>({
   name: 'bold',
-  pattern: /.*\*{2}([^\s][^*]*[^\s*])\*{2}$|.*\*{2}([^\s*])\*{2}$/,
+  pattern: /.*\*{2}([^\s][^*]*[^\s*])\*{2}\s$|.*\*{2}([^\s*])\*{2}\s$/,
   action: ({ inlineEditor, prefixText, inlineRange, pattern, undoManager }) => {
     const match = prefixText.match(pattern);
     if (!match) return;
 
     const targetText = match[1] ?? match[2];
-    const annotatedText = match[0].slice(-targetText.length - 2 * 2);
-    const startIndex = inlineRange.index - annotatedText.length;
-
-    inlineEditor.insertText(
-      {
-        index: startIndex + annotatedText.length,
-        length: 0,
-      },
-      ' '
-    );
-    inlineEditor.setInlineRange({
-      index: startIndex + annotatedText.length + 1,
-      length: 0,
-    });
+    const annotatedText = match[0].slice(-(targetText.length + 2 * 2 + 1), -1);
+    const startIndex = inlineRange.index - annotatedText.length - 1;
 
     undoManager.stopCapturing();
 
@@ -110,18 +84,13 @@ export const BoldMarkdown = InlineMarkdownExtension<AffineTextAttributes>({
     );
 
     inlineEditor.deleteText({
-      index: startIndex + annotatedText.length,
-      length: 1,
-    });
-    inlineEditor.deleteText({
-      index: startIndex + annotatedText.length - 2,
-      length: 2,
+      index: inlineRange.index - 3,
+      length: 3,
     });
     inlineEditor.deleteText({
       index: startIndex,
       length: 2,
     });
-
     inlineEditor.setInlineRange({
       index: startIndex + annotatedText.length - 4,
       length: 0,
@@ -131,26 +100,14 @@ export const BoldMarkdown = InlineMarkdownExtension<AffineTextAttributes>({
 
 export const ItalicExtension = InlineMarkdownExtension<AffineTextAttributes>({
   name: 'italic',
-  pattern: /.*\*{1}([^\s][^*]*[^\s*])\*{1}$|.*\*{1}([^\s*])\*{1}$/,
+  pattern: /.*\*{1}([^\s][^*]*[^\s*])\*{1}\s$|.*\*{1}([^\s*])\*{1}\s$/,
   action: ({ inlineEditor, prefixText, inlineRange, pattern, undoManager }) => {
     const match = prefixText.match(pattern);
     if (!match) return;
 
     const targetText = match[1] ?? match[2];
-    const annotatedText = match[0].slice(-targetText.length - 1 * 2);
-    const startIndex = inlineRange.index - annotatedText.length;
-
-    inlineEditor.insertText(
-      {
-        index: startIndex + annotatedText.length,
-        length: 0,
-      },
-      ' '
-    );
-    inlineEditor.setInlineRange({
-      index: startIndex + annotatedText.length + 1,
-      length: 0,
-    });
+    const annotatedText = match[0].slice(-(targetText.length + 1 * 2 + 1), -1);
+    const startIndex = inlineRange.index - annotatedText.length - 1;
 
     undoManager.stopCapturing();
 
@@ -165,18 +122,13 @@ export const ItalicExtension = InlineMarkdownExtension<AffineTextAttributes>({
     );
 
     inlineEditor.deleteText({
-      index: startIndex + annotatedText.length,
-      length: 1,
-    });
-    inlineEditor.deleteText({
-      index: startIndex + annotatedText.length - 1,
-      length: 1,
+      index: inlineRange.index - 2,
+      length: 2,
     });
     inlineEditor.deleteText({
       index: startIndex,
       length: 1,
     });
-
     inlineEditor.setInlineRange({
       index: startIndex + annotatedText.length - 2,
       length: 0,
@@ -187,7 +139,7 @@ export const ItalicExtension = InlineMarkdownExtension<AffineTextAttributes>({
 export const StrikethroughExtension =
   InlineMarkdownExtension<AffineTextAttributes>({
     name: 'strikethrough',
-    pattern: /.*~{2}([^\s][^~]*[^\s])~{2}$|.*~{2}([^\s~])~{2}$/,
+    pattern: /.*~{2}([^\s][^~]*[^\s])~{2}\s$|.*~{2}([^\s~])~{2}\s$/,
     action: ({
       inlineEditor,
       prefixText,
@@ -199,20 +151,11 @@ export const StrikethroughExtension =
       if (!match) return;
 
       const targetText = match[1] ?? match[2];
-      const annotatedText = match[0].slice(-targetText.length - 2 * 2);
-      const startIndex = inlineRange.index - annotatedText.length;
-
-      inlineEditor.insertText(
-        {
-          index: startIndex + annotatedText.length,
-          length: 0,
-        },
-        ' '
+      const annotatedText = match[0].slice(
+        -targetText.length - (2 * 2 + 1),
+        -1
       );
-      inlineEditor.setInlineRange({
-        index: startIndex + annotatedText.length + 1,
-        length: 0,
-      });
+      const startIndex = inlineRange.index - annotatedText.length - 1;
 
       undoManager.stopCapturing();
 
@@ -227,12 +170,8 @@ export const StrikethroughExtension =
       );
 
       inlineEditor.deleteText({
-        index: startIndex + annotatedText.length,
-        length: 1,
-      });
-      inlineEditor.deleteText({
-        index: startIndex + annotatedText.length - 2,
-        length: 2,
+        index: inlineRange.index - 3,
+        length: 3,
       });
       inlineEditor.deleteText({
         index: startIndex,
@@ -249,7 +188,7 @@ export const StrikethroughExtension =
 export const UnderthroughExtension =
   InlineMarkdownExtension<AffineTextAttributes>({
     name: 'underthrough',
-    pattern: /.*~{1}([^\s][^~]*[^\s~])~{1}$|.*~{1}([^\s~])~{1}$/,
+    pattern: /.*~{1}([^\s][^~]*[^\s~])~{1}\s$|.*~{1}([^\s~])~{1}\s$/,
     action: ({
       inlineEditor,
       prefixText,
@@ -261,20 +200,11 @@ export const UnderthroughExtension =
       if (!match) return;
 
       const targetText = match[1] ?? match[2];
-      const annotatedText = match[0].slice(-targetText.length - 1 * 2);
-      const startIndex = inlineRange.index - annotatedText.length;
-
-      inlineEditor.insertText(
-        {
-          index: startIndex + annotatedText.length,
-          length: 0,
-        },
-        ' '
+      const annotatedText = match[0].slice(
+        -(targetText.length + 1 * 2 + 1),
+        -1
       );
-      inlineEditor.setInlineRange({
-        index: startIndex + annotatedText.length + 1,
-        length: 0,
-      });
+      const startIndex = inlineRange.index - annotatedText.length - 1;
 
       undoManager.stopCapturing();
 
@@ -289,12 +219,8 @@ export const UnderthroughExtension =
       );
 
       inlineEditor.deleteText({
-        index: startIndex + annotatedText.length,
-        length: 1,
-      });
-      inlineEditor.deleteText({
-        index: inlineRange.index - 1,
-        length: 1,
+        index: inlineRange.index - 2,
+        length: 2,
       });
       inlineEditor.deleteText({
         index: startIndex,
@@ -310,26 +236,14 @@ export const UnderthroughExtension =
 
 export const CodeExtension = InlineMarkdownExtension<AffineTextAttributes>({
   name: 'code',
-  pattern: /.*`([^\s][^`]*[^\s])`$|.*`([^\s`])`$/,
+  pattern: /.*`([^\s][^`]*[^\s])`\s$|.*`([^\s`])`\s$/,
   action: ({ inlineEditor, prefixText, inlineRange, pattern, undoManager }) => {
     const match = prefixText.match(pattern);
     if (!match) return;
 
     const targetText = match[1] ?? match[2];
-    const annotatedText = match[0].slice(-targetText.length - 1 * 2);
-    const startIndex = inlineRange.index - annotatedText.length;
-
-    inlineEditor.insertText(
-      {
-        index: startIndex + annotatedText.length,
-        length: 0,
-      },
-      ' '
-    );
-    inlineEditor.setInlineRange({
-      index: startIndex + annotatedText.length + 1,
-      length: 0,
-    });
+    const annotatedText = match[0].slice(-(targetText.length + 1 * 2 + 1), -1);
+    const startIndex = inlineRange.index - annotatedText.length - 1;
 
     undoManager.stopCapturing();
 
@@ -344,12 +258,8 @@ export const CodeExtension = InlineMarkdownExtension<AffineTextAttributes>({
     );
 
     inlineEditor.deleteText({
-      index: startIndex + annotatedText.length,
-      length: 1,
-    });
-    inlineEditor.deleteText({
-      index: startIndex + annotatedText.length - 1,
-      length: 1,
+      index: inlineRange.index - 2,
+      length: 2,
     });
     inlineEditor.deleteText({
       index: startIndex,

blocksuite/affine/rich-text/src/index.ts

@@ -10,6 +10,5 @@ export {
   onModelTextUpdated,
   selectTextModel,
 } from './dom';
-export { markdownInput } from './markdown';
 export { RichText } from './rich-text';
 export * from './utils';

blocksuite/affine/rich-text/src/markdown/divider.ts

@@ -1,42 +0,0 @@
-import {
-  DividerBlockModel,
-  ParagraphBlockModel,
-} from '@blocksuite/affine-model';
-import { matchModels } from '@blocksuite/affine-shared/utils';
-import type { BlockStdScope } from '@blocksuite/std';
-import type { BlockModel } from '@blocksuite/store';
-
-import { focusTextModel } from '../dom.js';
-import { beforeConvert } from './utils.js';
-
-export function toDivider(
-  std: BlockStdScope,
-  model: BlockModel,
-  prefix: string
-) {
-  const { store: doc } = std;
-  if (
-    matchModels(model, [DividerBlockModel]) ||
-    (matchModels(model, [ParagraphBlockModel]) && model.props.type === 'quote')
-  ) {
-    return;
-  }
-
-  const parent = doc.getParent(model);
-  if (!parent) return;
-
-  const index = parent.children.indexOf(model);
-  beforeConvert(std, model, prefix.length);
-  const blockProps = {
-    children: model.children,
-  };
-  doc.addBlock('affine:divider', blockProps, parent, index);
-
-  const nextBlock = parent.children[index + 1];
-  let id = nextBlock?.id;
-  if (!id) {
-    id = doc.addBlock('affine:paragraph', {}, parent);
-  }
-  focusTextModel(std, id);
-  return id;
-}

blocksuite/affine/rich-text/src/markdown/index.ts

@@ -1 +0,0 @@
-export { markdownInput } from './markdown-input.js';

blocksuite/affine/rich-text/src/markdown/list.ts

@@ -1,54 +0,0 @@
-import {
-  type ListProps,
-  type ListType,
-  ParagraphBlockModel,
-} from '@blocksuite/affine-model';
-import { matchModels, toNumberedList } from '@blocksuite/affine-shared/utils';
-import type { BlockStdScope } from '@blocksuite/std';
-import type { BlockModel } from '@blocksuite/store';
-
-import { focusTextModel } from '../dom.js';
-import { beforeConvert } from './utils.js';
-
-export function toList(
-  std: BlockStdScope,
-  model: BlockModel,
-  listType: ListType,
-  prefix: string,
-  otherProperties?: Partial<ListProps>
-) {
-  if (!matchModels(model, [ParagraphBlockModel])) {
-    return;
-  }
-  const { store: doc } = std;
-  const parent = doc.getParent(model);
-  if (!parent) return;
-
-  beforeConvert(std, model, prefix.length);
-
-  if (listType !== 'numbered') {
-    const index = parent.children.indexOf(model);
-    const blockProps = {
-      type: listType,
-      text: model.text?.clone(),
-      children: model.children,
-      ...otherProperties,
-    };
-    doc.deleteBlock(model, {
-      deleteChildren: false,
-    });
-
-    const id = doc.addBlock('affine:list', blockProps, parent, index);
-    focusTextModel(std, id);
-    return id;
-  }
-
-  let order = parseInt(prefix.slice(0, -1));
-  if (!Number.isInteger(order)) order = 1;
-
-  const id = toNumberedList(std, model, order);
-  if (!id) return;
-
-  focusTextModel(std, id);
-  return id;
-}

blocksuite/affine/rich-text/src/markdown/markdown-input.ts

@@ -1,98 +0,0 @@
-import {
-  CalloutBlockModel,
-  CodeBlockModel,
-  ParagraphBlockModel,
-} from '@blocksuite/affine-model';
-import {
-  isHorizontalRuleMarkdown,
-  isMarkdownPrefix,
-  matchModels,
-} from '@blocksuite/affine-shared/utils';
-import { type BlockStdScope, TextSelection } from '@blocksuite/std';
-
-import { getInlineEditorByModel } from '../dom.js';
-import { toDivider } from './divider.js';
-import { toList } from './list.js';
-import { toParagraph } from './paragraph.js';
-import { toCode } from './to-code.js';
-import { getPrefixText } from './utils.js';
-
-export function markdownInput(
-  std: BlockStdScope,
-  id?: string
-): string | undefined {
-  if (!id) {
-    const selection = std.selection;
-    const text = selection.find(TextSelection);
-    id = text?.from.blockId;
-  }
-  if (!id) return;
-  const model = std.store.getBlock(id)?.model;
-  if (!model) return;
-  const inline = getInlineEditorByModel(std, model);
-  if (!inline) return;
-  const range = inline.getInlineRange();
-  if (!range) return;
-
-  const prefixText = getPrefixText(inline);
-  if (!isMarkdownPrefix(prefixText)) return;
-
-  const isParagraph = matchModels(model, [ParagraphBlockModel]);
-  const isHeading = isParagraph && model.props.type.startsWith('h');
-  const isParagraphQuoteBlock = isParagraph && model.props.type === 'quote';
-  const isCodeBlock = matchModels(model, [CodeBlockModel]);
-  if (
-    isHeading ||
-    isParagraphQuoteBlock ||
-    isCodeBlock ||
-    matchModels(model.parent, [CalloutBlockModel])
-  )
-    return;
-
-  const lineInfo = inline.getLine(range.index);
-  if (!lineInfo) return;
-
-  const { lineIndex, rangeIndexRelatedToLine } = lineInfo;
-  if (lineIndex !== 0 || rangeIndexRelatedToLine > prefixText.length) return;
-
-  // try to add code block
-  const codeMatch = prefixText.match(/^```([a-zA-Z0-9]*)$/g);
-  if (codeMatch) {
-    return toCode(std, model, prefixText, codeMatch[0].slice(3));
-  }
-
-  if (isHorizontalRuleMarkdown(prefixText.trim())) {
-    return toDivider(std, model, prefixText);
-  }
-
-  switch (prefixText.trim()) {
-    case '[]':
-    case '[ ]':
-      return toList(std, model, 'todo', prefixText, {
-        checked: false,
-      });
-    case '[x]':
-      return toList(std, model, 'todo', prefixText, {
-        checked: true,
-      });
-    case '-':
-    case '*':
-      return toList(std, model, 'bulleted', prefixText);
-    case '#':
-      return toParagraph(std, model, 'h1', prefixText);
-    case '##':
-      return toParagraph(std, model, 'h2', prefixText);
-    case '###':
-      return toParagraph(std, model, 'h3', prefixText);
-    case '####':
-      return toParagraph(std, model, 'h4', prefixText);
-    case '#####':
-      return toParagraph(std, model, 'h5', prefixText);
-    case '######':
-      return toParagraph(std, model, 'h6', prefixText);
-    case '>':
-      return toParagraph(std, model, 'quote', prefixText);
-    default:
-      return toList(std, model, 'numbered', prefixText);
-  }
-}

blocksuite/affine/rich-text/src/markdown/paragraph.ts

@@ -1,49 +0,0 @@
-import {
-  ParagraphBlockModel,
-  type ParagraphType,
-} from '@blocksuite/affine-model';
-import { matchModels } from '@blocksuite/affine-shared/utils';
-import type { BlockStdScope } from '@blocksuite/std';
-import type { BlockModel } from '@blocksuite/store';
-
-import { focusTextModel } from '../dom.js';
-import { beforeConvert } from './utils.js';
-
-export function toParagraph(
-  std: BlockStdScope,
-  model: BlockModel,
-  type: ParagraphType,
-  prefix: string
-) {
-  const { store: doc } = std;
-  if (!matchModels(model, [ParagraphBlockModel])) {
-    const parent = doc.getParent(model);
-    if (!parent) return;
-
-    const index = parent.children.indexOf(model);
-
-    beforeConvert(std, model, prefix.length);
-
-    const blockProps = {
-      type: type,
-      text: model.text?.clone(),
-      children: model.children,
-    };
-    doc.deleteBlock(model, { deleteChildren: false });
-    const id = doc.addBlock('affine:paragraph', blockProps, parent, index);
-
-    focusTextModel(std, id);
-    return id;
-  }
-
-  if (matchModels(model, [ParagraphBlockModel]) && model.props.type !== type) {
-    beforeConvert(std, model, prefix.length);
-
-    doc.updateBlock(model, { type });
-
-    focusTextModel(std, model.id);
-  }
-
-  // If the model is already a paragraph with the same type, do nothing
-  return model.id;
-}

blocksuite/affine/rich-text/src/markdown/to-code.ts

@@ -1,42 +0,0 @@
-import { ParagraphBlockModel } from '@blocksuite/affine-model';
-import { matchModels } from '@blocksuite/affine-shared/utils';
-import type { BlockStdScope } from '@blocksuite/std';
-import type { BlockModel } from '@blocksuite/store';
-
-import { focusTextModel } from '../dom.js';
-
-export function toCode(
-  std: BlockStdScope,
-  model: BlockModel,
-  prefixText: string,
-  language: string | null
-) {
-  if (
-    matchModels(model, [ParagraphBlockModel]) &&
-    model.props.type === 'quote'
-  ) {
-    return;
-  }
-
-  const doc = model.store;
-  const parent = doc.getParent(model);
-  if (!parent) {
-    return;
-  }
-
-  doc.captureSync();
-  const index = parent.children.indexOf(model);
-
-  const codeId = doc.addBlock('affine:code', { language }, parent, index);
-
-  if (model.text && model.text.length > prefixText.length) {
-    const text = model.text.clone();
-    doc.addBlock('affine:paragraph', { text }, parent, index + 1);
-    text.delete(0, prefixText.length);
-  }
-  doc.deleteBlock(model, { bringChildrenTo: parent });
-
-  focusTextModel(std, codeId);
-
-  return codeId;
-}

blocksuite/affine/rich-text/src/markdown/utils.ts

@@ -1,39 +0,0 @@
-import type { BlockStdScope } from '@blocksuite/std';
-import type { InlineEditor } from '@blocksuite/std/inline';
-import type { BlockModel } from '@blocksuite/store';
-
-import { focusTextModel } from '../dom.js';
-
-export function getPrefixText(inlineEditor: InlineEditor) {
-  const inlineRange = inlineEditor.getInlineRange();
-  if (!inlineRange) return '';
-  const firstLineEnd = inlineEditor.yTextString.search(/\n/);
-  if (firstLineEnd !== -1 && inlineRange.index > firstLineEnd) {
-    return '';
-  }
-  const textPoint = inlineEditor.getTextPoint(inlineRange.index);
-  if (!textPoint) return '';
-  const [leafStart, offsetStart] = textPoint;
-  return leafStart.textContent
-    ? leafStart.textContent.slice(0, offsetStart)
-    : '';
-}
-
-export function beforeConvert(
-  std: BlockStdScope,
-  model: BlockModel,
-  index: number
-) {
-  const { text } = model;
-  if (!text) return;
-  // Add a space after the text, then stop capturing
-  // So when the user undo, the prefix will be restored with a `space`
-  // Ex. (| is the cursor position)
-  // *| <- user input
-  // <space> -> bullet list
-  // *<space>| -> undo
-  text.insert(' ', index);
-  focusTextModel(std, model.id, index + 1);
-  std.store.captureSync();
-  text.delete(0, index + 1);
-}

blocksuite/affine/rich-text/src/rich-text.ts

@@ -22,6 +22,7 @@ import * as Y from 'yjs';
 import { z } from 'zod';
 
 import { onVBeforeinput, onVCompositionEnd } from './hooks.js';
+import { getPrefixText } from './utils.js';
 
 interface RichTextStackItem {
   meta: Map<'richtext-v-range', InlineRange | null>;
@@ -186,38 +187,60 @@ export class RichText extends WithDisposable(ShadowlessElement) {
 
     const markdownMatches = this.markdownMatches;
     if (markdownMatches) {
-      inlineEditor.disposables.addFromEvent(
-        this.inlineEventSource ?? this.inlineEditorContainer,
-        'keydown',
-        (e: KeyboardEvent) => {
-          if (e.key !== ' ' && e.key !== 'Enter') return;
+      const markdownTransform = (isEnter: boolean = false) => {
+        let inlineRange = inlineEditor.getInlineRange();
+        if (!inlineRange) return false;
 
-          const inlineRange = inlineEditor.getInlineRange();
-          if (!inlineRange || inlineRange.length > 0) return;
+        let prefixText = getPrefixText(inlineEditor);
+        if (isEnter) prefixText = `${prefixText} `;
 
-          const nearestLineBreakIndex = inlineEditor.yTextString
-            .slice(0, inlineRange.index)
-            .lastIndexOf('\n');
-          const prefixText = inlineEditor.yTextString.slice(
-            nearestLineBreakIndex + 1,
-            inlineRange.index
-          );
-
-          for (const match of markdownMatches) {
-            const { pattern, action } = match;
-            if (prefixText.match(pattern)) {
-              action({
-                inlineEditor,
-                prefixText,
-                inlineRange,
-                pattern,
-                undoManager: this.undoManager,
+        for (const match of markdownMatches) {
+          const { pattern, action } = match;
+          if (prefixText.match(pattern)) {
+            if (isEnter) {
+              inlineEditor.insertText(
+                {
+                  index: inlineRange.index,
+                  length: 0,
+                },
+                ' '
+              );
+              inlineEditor.setInlineRange({
+                index: inlineRange.index + 1,
+                length: 0,
               });
-              e.preventDefault();
-              break;
+              inlineRange = inlineEditor.getInlineRange();
+              if (!inlineRange) return false;
             }
+
+            action({
+              inlineEditor,
+              prefixText,
+              inlineRange,
+              pattern,
+              undoManager: this.undoManager,
+            });
+            return true;
           }
         }
+        return false;
+      };
+
+      inlineEditor.disposables.add(
+        inlineEditor.slots.inputting.subscribe(data => {
+          if (!inlineEditor.isComposing && data === ' ') {
+            markdownTransform();
+          }
+        })
+      );
+
+      inlineEditor.disposables.add(
+        inlineEditor.slots.keydown.subscribe(event => {
+          if (event.key === 'Enter' && markdownTransform(true)) {
+            event.stopPropagation();
+            event.preventDefault();
+          }
+        })
       );
     }
 

blocksuite/affine/rich-text/src/utils.ts

@@ -52,3 +52,17 @@ export function clearMarksOnDiscontinuousInput(
     }
   });
 }
+
+export function getPrefixText(inlineEditor: InlineEditor) {
+  const inlineRange = inlineEditor.getInlineRange();
+  if (!inlineRange || inlineRange.length > 0) return '';
+
+  const nearestLineBreakIndex = inlineEditor.yTextString
+    .slice(0, inlineRange.index)
+    .lastIndexOf('\n');
+  const prefixText = inlineEditor.yTextString.slice(
+    nearestLineBreakIndex + 1,
+    inlineRange.index
+  );
+  return prefixText;
+}

blocksuite/affine/shared/package.json

@@ -10,6 +10,8 @@
   "author": "toeverything",
   "license": "MIT",
   "dependencies": {
+    "@blocksuite/affine": "workspace:*",
+    "@blocksuite/affine-ext-loader": "workspace:*",
     "@blocksuite/affine-model": "workspace:*",
     "@blocksuite/global": "workspace:*",
     "@blocksuite/icons": "^2.2.12",
@@ -63,7 +65,8 @@
     "./theme": "./src/theme/index.ts",
     "./styles": "./src/styles/index.ts",
     "./services": "./src/services/index.ts",
-    "./adapters": "./src/adapters/index.ts"
+    "./adapters": "./src/adapters/index.ts",
+    "./test-utils": "./src/test-utils/index.ts"
   },
   "files": [
     "src",

blocksuite/affine/shared/src/__tests__/commands/block-crud/get-first-block.unit.spec.ts

@@ -4,7 +4,7 @@
 import { describe, expect, it } from 'vitest';
 
 import { getFirstBlockCommand } from '../../../commands/block-crud/get-first-content-block';
-import { affine } from '../../helpers/affine-template';
+import { affine } from '../../../test-utils';
 
 describe('commands/block-crud', () => {
   describe('getFirstBlockCommand', () => {

blocksuite/affine/shared/src/__tests__/commands/block-crud/get-last-block.unit.spec.ts

@@ -4,7 +4,7 @@
 import { describe, expect, it } from 'vitest';
 
 import { getLastBlockCommand } from '../../../commands/block-crud/get-last-content-block';
-import { affine } from '../../helpers/affine-template';
+import { affine } from '../../../test-utils';
 
 describe('commands/block-crud', () => {
   describe('getLastBlockCommand', () => {

blocksuite/affine/shared/src/__tests__/commands/model-crud/replace-selected-text-with-blocks.unit.spec.ts

@@ -1,13 +1,13 @@
 /**
  * @vitest-environment happy-dom
  */
-import '../../helpers/affine-test-utils';
+import '../../../test-utils/affine-test-utils';
 
 import type { TextSelection } from '@blocksuite/std';
 import { describe, expect, it } from 'vitest';
 
 import { replaceSelectedTextWithBlocksCommand } from '../../../commands/model-crud/replace-selected-text-with-blocks';
-import { affine, block } from '../../helpers/affine-template';
+import { affine, block } from '../../../test-utils';
 
 describe('commands/model-crud', () => {
   describe('replaceSelectedTextWithBlocksCommand', () => {

blocksuite/affine/shared/src/__tests__/commands/selection/is-nothing-selected.unit.spec.ts

@@ -6,7 +6,7 @@ import { describe, expect, it, vi } from 'vitest';
 
 import { isNothingSelectedCommand } from '../../../commands/selection/is-nothing-selected';
 import { ImageSelection } from '../../../selection';
-import { affine } from '../../helpers/affine-template';
+import { affine } from '../../../test-utils';
 
 describe('commands/selection', () => {
   describe('isNothingSelectedCommand', () => {

blocksuite/affine/shared/src/__tests__/test-utils/affine-template.unit.spec.ts

@@ -1,7 +1,7 @@
 import { TextSelection } from '@blocksuite/std';
 import { describe, expect, it } from 'vitest';
 
-import { affine } from './affine-template';
+import { affine } from '../../test-utils';
 
 describe('helpers/affine-template', () => {
   it('should create a basic document structure from template', () => {

blocksuite/affine/shared/src/services/citation-service/citation-service.ts

@@ -0,0 +1,84 @@
+import { type Container, createIdentifier } from '@blocksuite/global/di';
+import { type BlockStdScope, StdIdentifier } from '@blocksuite/std';
+import { type BlockModel, Extension } from '@blocksuite/store';
+
+import { DocModeProvider } from '../doc-mode-service';
+import type {
+  CitationEvents,
+  CitationEventType,
+} from '../telemetry-service/citation';
+import { TelemetryProvider } from '../telemetry-service/telemetry-service';
+
+const CitationEventTypeMap = {
+  Hover: 'AICitationHoverSource',
+  Expand: 'AICitationExpandSource',
+  Delete: 'AICitationDelete',
+  Edit: 'AICitationEdit',
+} as const;
+
+type EventType = keyof typeof CitationEventTypeMap;
+
+type EventTypeMapping = {
+  [K in EventType]: CitationEventType;
+};
+
+export interface CitationViewService {
+  /**
+   * Tracks citation-related events
+   * @param type - The type of citation event to track
+   * @param properties - The properties of the event
+   */
+  trackEvent<T extends EventType>(
+    type: T,
+    properties?: CitationEvents[EventTypeMapping[T]]
+  ): void;
+  /**
+   * Checks if the model is a citation model
+   * @param model - The model to check
+   * @returns True if the model is a citation model, false otherwise
+   */
+  isCitationModel(model: BlockModel): boolean;
+}
+
+export const CitationProvider =
+  createIdentifier<CitationViewService>('CitationService');
+
+export class CitationService extends Extension implements CitationViewService {
+  constructor(private readonly std: BlockStdScope) {
+    super();
+  }
+
+  static override setup(di: Container) {
+    di.addImpl(CitationProvider, CitationService, [StdIdentifier]);
+  }
+
+  get docModeService() {
+    return this.std.getOptional(DocModeProvider);
+  }
+
+  get telemetryService() {
+    return this.std.getOptional(TelemetryProvider);
+  }
+
+  isCitationModel = (model: BlockModel) => {
+    return (
+      'footnoteIdentifier' in model.props &&
+      !!model.props.footnoteIdentifier &&
+      'style' in model.props &&
+      model.props.style === 'citation'
+    );
+  };
+
+  trackEvent<T extends EventType>(
+    type: T,
+    properties?: CitationEvents[EventTypeMapping[T]]
+  ) {
+    const editorMode = this.docModeService?.getEditorMode() ?? 'page';
+    this.telemetryService?.track(CitationEventTypeMap[type], {
+      page: editorMode === 'page' ? 'doc editor' : 'whiteboard editor',
+      module: 'AI Result',
+      control: 'Source',
+      ...properties,
+    });
+  }
+}

blocksuite/affine/shared/src/services/citation-service/index.ts

@@ -0,0 +1 @@
+export * from './citation-service';

blocksuite/affine/shared/src/services/index.ts

@@ -1,5 +1,6 @@
 export * from './auto-clear-selection-service';
 export * from './block-meta-service';
+export * from './citation-service';
 export * from './doc-display-meta-service';
 export * from './doc-mode-service';
 export * from './drag-handle-config';

blocksuite/affine/shared/src/services/telemetry-service/citation.ts

@@ -0,0 +1,8 @@
+import type { TelemetryEvent } from './types';
+export type CitationEventType =
+  | 'AICitationHoverSource'
+  | 'AICitationExpandSource'
+  | 'AICitationDelete'
+  | 'AICitationEdit';
+
+export type CitationEvents = Record<CitationEventType, TelemetryEvent>;

blocksuite/affine/shared/src/services/telemetry-service/index.ts

@@ -1,3 +1,4 @@
+export * from './citation.js';
 export * from './database.js';
 export * from './link.js';
 export * from './telemetry-service.js';

blocksuite/affine/shared/src/services/telemetry-service/telemetry-service.ts

@@ -1,6 +1,7 @@
 import { createIdentifier } from '@blocksuite/global/di';
 import type { ExtensionType } from '@blocksuite/store';
 
+import type { CitationEvents } from './citation.js';
 import type { CodeBlockEvents } from './code-block.js';
 import type { OutDatabaseAllEvents } from './database.js';
 import type { LinkToolbarEvents } from './link.js';
@@ -28,7 +29,8 @@ export type TelemetryEventMap = OutDatabaseAllEvents &
   LinkToolbarEvents &
   SlashMenuEvents &
   CodeBlockEvents &
-  NoteEvents & {
+  NoteEvents &
+  CitationEvents & {
     DocCreated: DocCreatedEvent;
     Link: TelemetryEvent;
     LinkedDocCreated: LinkedDocCreatedEvent;

blocksuite/affine/shared/src/test-utils/affine-template.ts

@@ -1,29 +1,32 @@
-import {
-  CodeBlockSchemaExtension,
-  DatabaseBlockSchemaExtension,
-  ImageBlockSchemaExtension,
-  ListBlockSchemaExtension,
-  NoteBlockSchemaExtension,
-  ParagraphBlockSchemaExtension,
-  RootBlockSchemaExtension,
-} from '@blocksuite/affine-model';
+import { getInternalStoreExtensions } from '@blocksuite/affine/extensions/store';
+import { StoreExtensionManager } from '@blocksuite/affine-ext-loader';
+import { Container } from '@blocksuite/global/di';
 import { TextSelection } from '@blocksuite/std';
-import { type Block, type Store } from '@blocksuite/store';
-import { Text } from '@blocksuite/store';
+import { type Block, type Store, Text } from '@blocksuite/store';
 import { TestWorkspace } from '@blocksuite/store/test';
 
 import { createTestHost } from './create-test-host';
 
-// Extensions array
-const extensions = [
-  RootBlockSchemaExtension,
-  NoteBlockSchemaExtension,
-  ParagraphBlockSchemaExtension,
-  ListBlockSchemaExtension,
-  ImageBlockSchemaExtension,
-  DatabaseBlockSchemaExtension,
-  CodeBlockSchemaExtension,
-];
+const manager = new StoreExtensionManager(getInternalStoreExtensions());
+const extensions = manager.get('store');
+
+// // Extensions array
+// const extensions = [
+//   RootBlockSchemaExtension,
+//   NoteBlockSchemaExtension,
+//   ParagraphBlockSchemaExtension,
+//   ListBlockSchemaExtension,
+//   ImageBlockSchemaExtension,
+//   DatabaseBlockSchemaExtension,
+//   CodeBlockSchemaExtension,
+//   RootStoreExtension,
+//   NoteStoreExtension,
+//   ParagraphStoreExtension,
+//   ListStoreExtension,
+//   ImageStoreExtension,
+//   DatabaseStoreExtension,
+//   CodeStoreExtension
+// ];
 
 // Mapping from tag names to flavours
 const tagToFlavour: Record<string, string> = {
@@ -75,8 +78,11 @@ export function affine(strings: TemplateStringsArray, ...values: any[]) {
   const workspace = new TestWorkspace({});
   workspace.meta.initialize();
   const doc = workspace.createDoc('test-doc');
-  const store = doc.getStore({ extensions });
-
+  const container = new Container();
+  extensions.forEach(extension => {
+    extension.setup(container);
+  });
+  const store = doc.getStore({ extensions, provider: container.provider() });
   let selectionInfo: SelectionInfo = {};
 
   // Use DOMParser to parse HTML string

blocksuite/affine/shared/src/test-utils/affine-test-utils.ts

@@ -63,10 +63,8 @@ function compareBlocks(
   if (JSON.stringify(actualProps) !== JSON.stringify(expectedProps))
     return false;
 
-  // eslint-disable-next-line @typescript-eslint/prefer-for-of
-  for (let i = 0; i < actual.children.length; i++) {
-    if (!compareBlocks(actual.children[i], expected.children[i], compareId))
-      return false;
+  for (const [i, child] of actual.children.entries()) {
+    if (!compareBlocks(child, expected.children[i], compareId)) return false;
   }
 
   return true;

blocksuite/affine/shared/src/test-utils/create-test-host.ts

@@ -240,7 +240,7 @@ export function createTestHost(doc: Store): EditorHost {
   std.selection = new MockSelectionStore();
 
   std.command = new CommandManager(std as any);
-  // @ts-expect-error
+  // @ts-expect-error dev-only
   host.command = std.command;
   host.selection = std.selection;
 

blocksuite/affine/shared/src/test-utils/index.ts

@@ -0,0 +1,3 @@
+export * from './affine-template';
+export * from './affine-test-utils';
+export * from './create-test-host';

blocksuite/affine/shared/src/utils/file/filesys.ts

@@ -176,9 +176,7 @@ export async function openFilesWith(
       resolve(input.files ? Array.from(input.files) : null);
     });
     // The `cancel` event fires when the user cancels the dialog.
-    input.addEventListener('cancel', () => {
-      resolve(null);
-    });
+    input.addEventListener('cancel', () => resolve(null));
     // Show the picker.
     if ('showPicker' in HTMLInputElement.prototype) {
       input.showPicker();
@@ -188,16 +186,16 @@ export async function openFilesWith(
   });
 }
 
-export function openSingleFileWith(
+export async function openSingleFileWith(
   acceptType?: AcceptTypes
 ): Promise<File | null> {
-  return openFilesWith(acceptType, false).then(files => files?.at(0) ?? null);
+  const files = await openFilesWith(acceptType, false);
+  return files?.at(0) ?? null;
 }
 
 export async function getImageFilesFromLocal() {
-  const imageFiles = await openFilesWith('Images');
-  if (!imageFiles) return [];
-  return imageFiles;
+  const files = await openFilesWith('Images');
+  return files ?? [];
 }
 
 export function downloadBlob(blob: Blob, name: string) {

blocksuite/affine/shared/src/utils/image.ts

@@ -26,3 +26,34 @@ export function readImageSize(file: File | Blob) {
     img.src = sanitizedURL;
   });
 }
+
+export function convertToPng(blob: Blob): Promise<Blob | null> {
+  return new Promise(resolve => {
+    const reader = new FileReader();
+
+    reader.addEventListener('load', _ => {
+      const img = new Image();
+
+      img.onload = () => {
+        const c = document.createElement('canvas');
+        c.width = img.width;
+        c.height = img.height;
+        const ctx = c.getContext('2d');
+        if (!ctx) {
+          resolve(null);
+          return;
+        }
+        ctx.drawImage(img, 0, 0);
+        c.toBlob(resolve, 'image/png');
+      };
+
+      img.onerror = () => resolve(null);
+
+      img.src = reader.result as string;
+    });
+
+    reader.addEventListener('error', () => resolve(null));
+
+    reader.readAsDataURL(blob);
+  });
+}

blocksuite/affine/shared/src/utils/string.ts

@@ -73,35 +73,3 @@ export function substringMatchScore(name: string, query: string) {
   // normalize
   return 0.5 * score;
 }
-
-/**
- * Checks if the prefix is a markdown prefix.
- * Ex. 1. 2. 3. - * [] [ ] [x] # ## ### #### ##### ###### --- *** ___ > ```
- */
-export function isMarkdownPrefix(prefix: string) {
-  return (
-    !!prefix.match(
-      /^(\d+\.|-|\*|\[ ?\]|\[x\]|(#){1,6}|>|```([a-zA-Z0-9]*))$/
-    ) || isHorizontalRuleMarkdown(prefix)
-  );
-}
-
-/**
- * Checks if the prefix is a valid markdown horizontal rule - https://www.markdownguide.org/basic-syntax/#horizontal-rules
- * @param prefix - The string to check for horizontal rule syntax
- * @returns boolean - True if the string represents a valid horizontal rule
- *
- * Valid horizontal rules:
- * - Three or more consecutive hyphens (e.g., "---", "----")
- * - Three or more consecutive asterisks (e.g., "***", "****")
- * - Three or more consecutive underscores (e.g., "___", "____")
- *
- * Invalid examples:
- * - Mixed characters (e.g., "--*", "-*-")
- * - Less than three characters (e.g., "--", "**")
- */
-export function isHorizontalRuleMarkdown(prefix: string) {
-  const horizontalRulePattern = /^(-{3,}|\*{3,}|_{3,})$/;
-
-  return !!prefix.match(horizontalRulePattern);
-}

blocksuite/affine/widgets/toolbar/src/toolbar.ts

@@ -80,6 +80,11 @@ export class AffineToolbarWidget extends WidgetComponent {
       }
     }
 
+    editor-toolbar[data-open][data-inline='true'] {
+      transition-property: opacity, overlay, display, transform;
+      transition-timing-function: ease;
+    }
+
     editor-toolbar[data-placement='inner'] {
       background-color: unset;
       box-shadow: unset;
@@ -536,9 +541,7 @@ export class AffineToolbarWidget extends WidgetComponent {
           );
         });
 
-        return () => {
-          subscription.unsubscribe();
-        };
+        disposables.add(subscription);
       })
     );
 
@@ -632,6 +635,7 @@ export class AffineToolbarWidget extends WidgetComponent {
 
         // Hides toolbar
         if (Flag.None === value || flags.check(Flag.Hiding, value)) {
+          if ('inline' in toolbar.dataset) delete toolbar.dataset.inline;
           if (toolbar.dataset.open) delete toolbar.dataset.open;
           // Closes dropdown menus
           toolbar

blocksuite/affine/widgets/toolbar/src/utils.ts

@@ -29,7 +29,7 @@ import {
   shift,
   size,
 } from '@floating-ui/dom';
-import { html, nothing, render } from 'lit';
+import { html, render } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { join } from 'lit/directives/join.js';
 import { keyed } from 'lit/directives/keyed.js';
@@ -297,11 +297,22 @@ export function renderToolbar(
   render(
     join(
       renderActions(primaryActionGroup, context),
-      innerToolbar ? nothing : renderToolbarSeparator()
+      innerToolbar ? null : renderToolbarSeparator()
     ),
     toolbar
   );
 
+  // Avoids shaking
+  if (flavour === 'affine:note' && context.std.range.value) {
+    if (!('inline' in toolbar.dataset)) {
+      toolbar.dataset.inline = '';
+    } else {
+      toolbar.dataset.inline = 'true';
+    }
+  } else {
+    delete toolbar.dataset.inline;
+  }
+
   if (toolbar.dataset.open) return;
   toolbar.dataset.open = 'true';
 }
@@ -358,14 +369,22 @@ function renderActionItem(action: ToolbarAction, context: ToolbarContext) {
   const innerToolbar = context.placement$.value === 'inner';
   const ids = action.id.split('.');
   const id = ids[ids.length - 1];
+  const label = action.label ?? action.tooltip ?? id;
+  const actived =
+    typeof action.active === 'function'
+      ? action.active(context)
+      : action.active;
+  const disabled =
+    typeof action.disabled === 'function'
+      ? action.disabled(context)
+      : action.disabled;
+
   return html`
     <editor-icon-button
       data-testid=${ifDefined(id)}
-      aria-label=${ifDefined(action.label ?? action.tooltip ?? id)}
-      ?active=${typeof action.active === 'function'
-        ? action.active(context)
-        : action.active}
-      ?disabled=${action.disabled}
+      aria-label=${ifDefined(label)}
+      ?active=${actived}
+      ?disabled=${disabled}
       .tooltip=${action.tooltip}
       .iconContainerPadding=${innerToolbar ? 4 : 2}
       .iconSize=${innerToolbar ? '16px' : undefined}
@@ -383,17 +402,24 @@ function renderMenuActionItem(action: ToolbarAction, context: ToolbarContext) {
   const innerToolbar = context.placement$.value === 'inner';
   const ids = action.id.split('.');
   const id = ids[ids.length - 1];
+  const label = action.label ?? action.tooltip ?? id;
+  const actived =
+    typeof action.active === 'function'
+      ? action.active(context)
+      : action.active;
+  const disabled =
+    typeof action.disabled === 'function'
+      ? action.disabled(context)
+      : action.disabled;
+  const destructive = action.variant === 'destructive' ? 'delete' : undefined;
+
   return html`
     <editor-menu-action
       data-testid=${ifDefined(id)}
-      aria-label=${ifDefined(action.label ?? action.tooltip ?? id)}
-      class="${ifDefined(
-        action.variant === 'destructive' ? 'delete' : undefined
-      )}"
-      ?active=${typeof action.active === 'function'
-        ? action.active(context)
-        : action.active}
-      ?disabled=${action.disabled}
+      aria-label=${ifDefined(label)}
+      class="${ifDefined(destructive)}"
+      ?active=${actived}
+      ?disabled=${disabled}
       .tooltip=${ifDefined(action.tooltip)}
       .iconContainerPadding=${innerToolbar ? 4 : 2}
       .iconSize=${innerToolbar ? '16px' : undefined}

blocksuite/docs/api/@blocksuite/store/classes/Store.md

@@ -118,10 +118,16 @@ Get the root block of the store.
 
 ### addBlock()
 
-> **addBlock**(`flavour`, `blockProps`, `parent?`, `parentIndex?`): `string`
+> **addBlock**\<`T`\>(`flavour`, `blockProps`, `parent?`, `parentIndex?`): `string`
 
 Creates and adds a new block to the store
 
+#### Type Parameters
+
+##### T
+
+`T` *extends* `BlockModel`\<`object`\> = `BlockModel`\<`object`\>
+
 #### Parameters
 
 ##### flavour
@@ -132,7 +138,7 @@ The block's flavour (type)
 
 ##### blockProps
 
-`Partial`\<`BlockSysProps` & `Record`\<`string`, `unknown`\> & `Omit`\<`BlockProps`, `"flavour"`\>\> = `{}`
+`Partial`\<`BlockProps` \| `PropsOfModel`\<`T`\> & `BlockSysProps`\> = `{}`
 
 Optional properties for the new block
 

blocksuite/framework/std/src/clipboard/clipboard.ts

@@ -124,18 +124,23 @@ export class Clipboard extends LifeCycleWatcher {
   copySlice = async (slice: Slice) => {
     const adapterKeys = this._adapters.map(adapter => adapter.mimeType);
 
-    await this.writeToClipboard(async _items => {
-      const items = { ..._items };
+    await this.writeToClipboard(async items => {
+      const filtered = (
+        await Promise.all(
+          adapterKeys.map(async type => {
+            const item = await this._getClipboardItem(slice, type);
+            if (typeof item === 'string') {
+              return [type, item];
+            }
+            return null;
+          })
+        )
+      ).filter((adapter): adapter is string[] => Boolean(adapter));
 
-      await Promise.all(
-        adapterKeys.map(async type => {
-          const item = await this._getClipboardItem(slice, type);
-          if (typeof item === 'string') {
-            items[type] = item;
-          }
-        })
-      );
-      return items;
+      return {
+        ...items,
+        ...Object.fromEntries(filtered),
+      };
     });
   };
 
@@ -263,49 +268,56 @@ export class Clipboard extends LifeCycleWatcher {
   }
 
   async writeToClipboard(
-    updateItems: (
-      items: Record<string, unknown>
-    ) => Promise<Record<string, unknown>> | Record<string, unknown>
+    updateItems: <T extends Record<string, unknown>>(items: T) => Promise<T> | T
   ) {
-    const _items = {
+    const items = await updateItems<
+      Partial<{
+        'text/plain': string;
+        'text/html': string;
+        'image/png': string | Blob;
+      }>
+    >({
       'text/plain': '',
       'text/html': '',
       'image/png': '',
-    };
-
-    const items = await updateItems(_items);
-
-    const text = items['text/plain'] as string;
-    const innerHTML = items['text/html'] as string;
-    const png = items['image/png'] as string | Blob;
+    });
+    const text = items['text/plain'] ?? '';
+    const innerHTML = items['text/html'] ?? '';
+    const image = items['image/png'];
 
     delete items['text/plain'];
     delete items['text/html'];
-    delete items['image/png'];
 
-    const snapshot = lz.compressToEncodedURIComponent(JSON.stringify(items));
-    const html = `<div data-blocksuite-snapshot='${snapshot}'>${innerHTML}</div>`;
-    const htmlBlob = new Blob([html], {
-      type: 'text/html',
-    });
-    const clipboardItems: Record<string, Blob> = {
-      'text/html': htmlBlob,
-    };
+    const clipboardItems: Record<string, Blob> = {};
+
+    if (image) {
+      const type = 'image/png';
+
+      delete items[type];
+
+      if (typeof image === 'string') {
+        clipboardItems[type] = new Blob([image], { type });
+      } else if (image instanceof Blob) {
+        clipboardItems[type] = image;
+      }
+    }
+
     if (text.length > 0) {
-      const textBlob = new Blob([text], {
-        type: 'text/plain',
-      });
-      clipboardItems['text/plain'] = textBlob;
+      const type = 'text/plain';
+      clipboardItems[type] = new Blob([text], { type });
     }
 
-    if (png instanceof Blob) {
-      clipboardItems['image/png'] = png;
-    } else if (png.length > 0) {
-      const pngBlob = new Blob([png], {
-        type: 'image/png',
-      });
-      clipboardItems['image/png'] = pngBlob;
+    const hasInnerHTML = Boolean(innerHTML.length);
+    const isEmpty = Object.keys(clipboardItems).length === 0;
+
+    // If there are no items, fall back to snapshot.
+    if (hasInnerHTML || isEmpty) {
+      const type = 'text/html';
+      const snapshot = lz.compressToEncodedURIComponent(JSON.stringify(items));
+      const html = `<div data-blocksuite-snapshot='${snapshot}'>${innerHTML}</div>`;
+      clipboardItems[type] = new Blob([html], { type });
     }
+
     await navigator.clipboard.write([new ClipboardItem(clipboardItems)]);
   }
 }

blocksuite/framework/std/src/event/dispatcher.ts

@@ -220,6 +220,12 @@ export class UIEventDispatcher extends LifeCycleWatcher {
 
       this._setActive(false);
     });
+    // When the document is hidden, the event dispatcher should be inactive
+    this.disposables.addFromEvent(document, 'visibilitychange', () => {
+      if (document.visibilityState === 'hidden') {
+        this._setActive(false);
+      }
+    });
   }
 
   private _buildEventScopeBySelection(name: EventName) {

blocksuite/framework/std/src/inline/inline-editor.ts

@@ -165,8 +165,9 @@ export class InlineEditor<
     inlineRangeSync: new Subject<Range | null>(),
     /**
      * Corresponding to the `compositionUpdate` and `beforeInput` events, and triggered only when the `inlineRange` is not null.
+     * The parameter is the `event.data`.
      */
-    inputting: new Subject<void>(),
+    inputting: new Subject<string>(),
     /**
      * Triggered only when the `inlineRange` is not null.
      */