Liste de tâches

Une liste avec un état d'achèvement. Tapez [ ] ou [x] suivi d'un espace dans un paragraphe vide, ou créez-en un depuis la barre d'outils, puis cliquez sur la case à cocher pour changer son état.

L'état coché est stocké avec chaque élément du document. Lorsqu'un élément est divisé, l'état coché suit l'élément qui conserve le texte plutôt que l'élément vide avant lui, donc diviser une tâche terminée ne change pas l'état de manière inattendue.

Ailes
Police par défautDécalage
HTMLChargement de l'éditeur…
JSONnabi-treeChargement de l'éditeur…
Installation
npm install nabi-note
Code
import {
  createNabiWith, mountSurface, mountToolbar, mountContextToolbar,
  mountHints, watchSettle, orderedListWing, taskListWing, tableWings,
  mountViewTools,
} from 'nabi-note'

const selected = [
  orderedListWing,
  taskListWing,
  ...tableWings,
]
const { nabi, registry } = createNabiWith(selected)

const root = document.querySelector('.nabi')!
const content = document.querySelector('.nabi-content')!

// The locale also sets the direction — Arabic and Urdu run right to left
mountSurface({ nabi, registry, root: content, locale: 'fr' })

const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale: 'fr' }
const toolbar = mountToolbar({ ...shared, root: document.querySelector('#toolbar')! })
const context = mountContextToolbar({ ...shared, root: document.querySelector('#context')! })
mountHints({ toolbar, context, root, surface: content })
// The preview and fullscreen buttons — they stand their own box at the end of the row
mountViewTools({ ...shared, root, container: document.querySelector('#toolbar')! })

// on every change — hook up your own code here
// nabi.onChange(() => user_callback(nabi.getHtml()))
ts
const selected = wings().use('tl').build()