SvelteSelection
Utilitaire réactif pour gérer la sélection de texte avec Svelte 5 runes
Note Not exported by name: you reach it through nabu.selection.
Related guide: Extensions →
Import
import { SvelteSelection } from '@aionbuilders/nabu/extend';Constructor
new SvelteSelection()Properties
anchorNode
anchorNode: Node | nullanchorOffset
anchorOffset: numberendOffset
endOffset: numberfocusNode
focusNode: Node | nullfocusOffset
focusOffset: numberis
is: booleanisCollapsed
isCollapsed: booleanstartOffset
startOffset: numbertext
text: stringrange readonly
readonly range: RangeMethods
setBaseAndExtent()
setBaseAndExtent(
anchorNode: Node,
anchorOffset: number,
focusNode: Node,
focusOffset: number
): booleanDéfinit la base et l'extension de la sélection.
| Parameter | Type | Description |
|---|---|---|
anchorNode | Node | Le nœud d'ancrage. |
anchorOffset | number | L'offset d'ancrage. |
focusNode | Node | Le nœud de focus. |
focusOffset | number | L'offset de focus. |
Returns boolean
True si l'opération a réussi *
sync()
sync(): booleanSynchronise (de façon synchrone et idempotente) l'état avec la sélection DOM courante.
selectionchange est asynchrone (tâche mise en file) : un événement d'entrée
(keydown, beforeinput…) qui suit de très près un déplacement du caret verrait
un état périmé. À appeler au tout début de ces handlers. Ne touche à l'état
que si les points de la sélection ont réellement changé (pas de churn réactif).
Returns boolean
True si l'état a été mis à jour *
Examples
const selection = new SvelteSelection();
// Utiliser selection.text, selection.isCollapsed, etc. dans vos composantsSource: src/lib/utils/selection.svelte.js:27