# Notes

- Human documentation: [https://docs.univer.ai/fr-FR/guides/sheets/features/notes](https://docs.univer.ai/fr-FR/guides/sheets/features/notes)

- Agent Markdown: [https://docs.univer.ai/fr-FR/guides/sheets/features/notes.md](https://docs.univer.ai/fr-FR/guides/sheets/features/notes.md)

- Requested language: `fr-FR`

- Content language: `fr-FR`

- Documentation version: `1.2.0`

- Source: [sheets/features/notes.fr-FR.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/sheets/features/notes.fr-FR.mdx)

---

#### Package metadata

```json
{
  "preset": [
    {
      "client": "@univerjs/preset-sheets-note",
      "locale": "@univerjs/preset-sheets-note/locales/fr-FR",
      "style": "@univerjs/preset-sheets-note/lib/index.css"
    }
  ],
  "plugins": [
    {
      "client": "@univerjs/sheets-note",
      "facade": "@univerjs/sheets-note/facade"
    },
    {
      "client": "@univerjs/sheets-note-ui",
      "locale": "@univerjs/sheets-note-ui/locale/fr-FR",
      "style": "@univerjs/sheets-note-ui/lib/index.css"
    }
  ],
  "server": false
}
```

La fonctionnalité de notes permet d’ajouter des commentaires dans les cellules d’une feuille de calcul afin de consigner des informations complémentaires ou d’apporter du contexte. Elle prend en charge différents styles de commentaires et différentes opérations, ce qui facilite la compréhension et le travail collaboratif sur les données.

> Interactive example: [Open the playground](/playground/sheets/notes)

## Mode prédéfini

### Installation

#### npm

```bash
npm install @univerjs/preset-sheets-note
```

#### pnpm

```bash
pnpm add @univerjs/preset-sheets-note
```

#### yarn

```bash
yarn add @univerjs/preset-sheets-note
```

#### bun

```bash
bun add @univerjs/preset-sheets-note
```

### Utilisation

```typescript
import { UniverSheetsCorePreset } from '@univerjs/preset-sheets-core'
import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'
import { UniverSheetsNotePreset } from '@univerjs/preset-sheets-note' // [!code ++]
import UniverPresetSheetsNoteEnUS from '@univerjs/preset-sheets-note/locales/en-US' // [!code ++]
import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'
import '@univerjs/preset-sheets-core/lib/index.css'
import '@univerjs/preset-sheets-note/lib/index.css' // [!code ++]

const { univerAPI } = createUniver({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: mergeLocales(
      UniverPresetSheetsCoreEnUS,
      UniverPresetSheetsNoteEnUS, // [!code ++]
    ),
  },
  presets: [
    UniverSheetsCorePreset(),
    UniverSheetsNotePreset(), // [!code ++]
  ],
})
```

## Mode extension

### Installation

#### npm

```bash
npm install @univerjs/sheets-note @univerjs/sheets-note-ui
```

#### pnpm

```bash
pnpm add @univerjs/sheets-note @univerjs/sheets-note-ui
```

#### yarn

```bash
yarn add @univerjs/sheets-note @univerjs/sheets-note-ui
```

#### bun

```bash
bun add @univerjs/sheets-note @univerjs/sheets-note-ui
```

### Utilisation

```typescript
import { LocaleType, mergeLocales, Univer } from '@univerjs/core'
import { UniverSheetsNotePlugin } from '@univerjs/sheets-note' // [!code ++]
import { UniverSheetsNoteUIPlugin } from '@univerjs/sheets-note-ui' // [!code ++]
import SheetsNoteUIEnUS from '@univerjs/sheets-note-ui/locale/en-US' // [!code ++]
import '@univerjs/sheets-note-ui/lib/index.css' // [!code ++]
import '@univerjs/sheets-note/facade' // [!code ++]

const univer = new Univer({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: mergeLocales(
      SheetsNoteUIEnUS, // [!code ++]
    ),
  },
})

univer.registerPlugin(UniverSheetsNotePlugin) // [!code ++]
univer.registerPlugin(UniverSheetsNoteUIPlugin) // [!code ++]
```

## Facade API

Les définitions de types complètes de l’API Facade sont disponibles dans la [référence de l’API Facade](https://docs.univer.ai/fr-FR/reference/facade.md).

### Importation

> [!INFO: Remarque sur le mode extension]
> Seul le mode extension nécessite d’importer manuellement le package Facade. Le mode prédéfini inclut déjà le package Facade correspondant, aucune importation supplémentaire n’est donc nécessaire.

```typescript
import '@univerjs/sheets-note/facade'
```

### Récupérer les notes

Utilisez `FWorksheet.getNotes` pour récupérer toutes les notes de la feuille de calcul.

```typescript
const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const notes = fWorksheet.getNotes()

notes.forEach((item) => {
  const { row, col, note } = item
  console.log(`Cell ${fWorksheet.getRange(row, col).getA1Notation()} has note: ${note}`)
})
```

Utilisez `FRange.getNote` pour récupérer la note de la cellule située en haut à gauche de la plage.

```typescript
const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const fRange = fWorksheet.getRange('A1:D10')
const note = fRange.getNote()
```

### Ajouter ou mettre à jour des notes

Utilisez `FRange.createOrUpdateNote` pour créer ou mettre à jour la note de la cellule située en haut à gauche de la plage.

```typescript
const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const fRange = fWorksheet.getRange('A1')
fRange.createOrUpdateNote({
  note: 'This is an annotation',
  width: 160,
  height: 100,
  show: true,
})
```

### Supprimer des notes

Utilisez `FRange.deleteNote` pour supprimer la note de la cellule située en haut à gauche de la plage.

```typescript
const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const notes = fWorksheet.getNotes()

if (notes.length > 0) {
  // Remove the first annotation in the worksheet
  const { row, col } = notes[0]
  fWorksheet.getRange(row, col).deleteNote()
}

// Remove the annotation in cell C1
const fRange = fWorksheet.getRange('C1')
fRange.deleteNote()
```

### Écouteurs d’événements

Les définitions de types complètes des événements sont disponibles dans la documentation des [événements](https://docs.univer.ai/fr-FR/reference/facade/events.md).

| Nom de l’événement      | Description                               |
| ----------------------- | ----------------------------------------- |
| `SheetNoteAdd`          | Déclenché après l’ajout d’une note        |
| `SheetNoteDelete`       | Déclenché après la suppression d’une note |
| `SheetNoteUpdate`       | Déclenché après la mise à jour d’une note |
| `SheetNoteShow`         | Déclenché lorsqu’une note est affichée    |
| `SheetNoteHide`         | Déclenché lorsqu’une note est masquée     |
| `BeforeSheetNoteAdd`    | Déclenché avant l’ajout d’une note        |
| `BeforeSheetNoteDelete` | Déclenché avant la suppression d’une note |
| `BeforeSheetNoteUpdate` | Déclenché avant la mise à jour d’une note |
| `BeforeSheetNoteShow`   | Déclenché avant l’affichage d’une note    |
| `BeforeSheetNoteHide`   | Déclenché avant le masquage d’une note    |

##### Exemples d’écouteurs d’événements

```typescript
// Triggered after adding an annotation
const disposable = univerAPI.addEvent(univerAPI.Event.SheetNoteAdd, (params) => {
  const { workbook, worksheet, row, col, note } = params
})

// Remove event listener using `disposable.dispose()`
```

```typescript
// Triggered before removing an annotation, can be canceled
const disposable = univerAPI.addEvent(univerAPI.Event.BeforeSheetNoteDelete, (params) => {
  const { workbook, worksheet, row, col, oldNote } = params

  // Cancel the annotation deletion operation
  params.cancel = true
})

// Remove event listener using `disposable.dispose()`
```