```js // @noErrors import { Spring, Tween, prefersReducedMotion, spring, tweened } from 'svelte/motion'; ``` ## Spring
Disponible à partir de la version 5.8.0
Un utilitaire permettant de créer un valeur évoluant à la manière d'un ressort. Les changements de valeur de `spring.target` vont déclencher l'évolution de `spring.current` vers cette valeur au cours du temps, en prenant en compte les paramètres de `spring.stiffness` et `spring.damping`. ```svelte ```
```dts class Spring {/*…*/} ```
```dts constructor(value: T, options?: SpringOpts); ```
```dts static of(fn: () => U, options?: SpringOpts): Spring; ```
Crée un ressort dont la valeur est liée à la valeur de retour de `fn`. Ceci doit être appelé à la racine d'un effet (par exemple, pendant l'initialisation d'un composant). ```svelte ```
```dts set(value: T, options?: SpringUpdateOpts): Promise; ```
Met la valeur de `spring.target` à `value` et renvoie une `Promise` qui se résout si et lorsque `spring.current` atteint cette valeur. Si `options.instant` vaut `true`, `spring.current` vaut immédiatement `spring.target`. Si `options.preserveMomentum` est fournie, le ressort va continuer sur sa trajectoire pendant le nombre de millisecondes fourni. Cela permet de simuler des mouvements plus "relâchés".
```dts damping: number; ```
```dts precision: number; ```
```dts stiffness: number; ```
```dts target: T; ```
La valeur finale du ressort. Cette propriété n'existe que sur la classe `Spring`, pas sur le store legacy `spring`.
```dts get current(): T; ```
La valeur courante du ressort. Cette propriété n'existe que sur la classe `Spring`, pas sur le store legacy `spring`.
## Tween
Disponible à partir de la version 5.8.0
Un utilitaire permettant de créer une valeur évoluant de manière "douce" vers sa valeur finale. Les changements de valeur de `tween.target` vont déclencher l'évolution de `tween.current` vers cette valeur au cours du temps, en prenant en compte les options `delay`, `duration`, et `easing`. ```svelte ```
```dts class Tween {/*…*/} ```
```dts static of(fn: () => U, options?: TweenedOptions | undefined): Tween; ```
Crée un tween dont la valeur est liée à la valeur de retour de `fn`. Ceci doit être appelé à la racine d'un effet (par exemple, pendant l'initialisation d'un composant). ```svelte ```
```dts constructor(value: T, options?: TweenedOptions); ```
```dts set(value: T, options?: TweenedOptions | undefined): Promise; ```
Met la valeur de `tween.target` à `value` et renvoie une `Promise` qui se résout si et lorsque que `tween.current` atteint cette valeur. Si des `options` sont fournies, elles vont écraser les valeurs par défaut du tween.
```dts get current(): T; ```
```dts set target(v: T); ```
```dts get target(): T; ```
## prefersReducedMotion
Disponible à partir de la version 5.7.0
Une [media query](/docs/svelte/svelte-reactivity#MediaQuery) qui correspond au choix de l'utilisateur ou l'utilisatrice d'activer l'[option de réduire la quantité des animations](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion). ```svelte {#if visible}

entre en volant, sauf si l'utilisateur veut moins d'animations

{/if} ```
```dts const prefersReducedMotion: MediaQuery; ```
## spring
Utilisez plutôt [`Spring`](/docs/svelte/svelte-motion#Spring)
La fonction `spring` de Svelte crée un store dont la valeur est animée avec un mouvement qui simule le comportement d'un ressort. Ceci signifie que lorsque la valeur du store change, au lieu de transitionner avec un mouvement linéaire, elle "rebondit" comme le ferait un ressort, en fonction des paramètres physiques fournis. Ceci ajoute un certain niveau de réalisme aux mouvements et permet d'améliorer l'expérience utilisateur.
```dts function spring( value?: T | undefined, opts?: SpringOpts | undefined ): Spring; ```
## tweened
Utilisez plutôt [`Tween`](/docs/svelte/svelte-motion#Tween)
La fonction `tweened` de Svelte crée un store spécial permettant de fournir des transitions de valeur "douces" au fil du temps.
```dts function tweened( value?: T | undefined, defaults?: TweenedOptions | undefined ): Tweened; ```
## Spring
```dts interface Spring extends Readable {/*…*/} ```
```dts set(new_value: T, opts?: SpringUpdateOpts): Promise; ```
```dts update: (fn: Updater, opts?: SpringUpdateOpts) => Promise; ```
- déprécié N'existe que sur le store legacy `spring`, pas sur la classe `Spring`
```dts subscribe(fn: (value: T) => void): Unsubscriber; ```
- déprécié N'existe que sur le store legacy `spring`, pas sur la classe `Spring`
```dts precision: number; ```
```dts damping: number; ```
```dts stiffness: number; ```
## Tweened
```dts interface Tweened extends Readable {/*…*/} ```
```dts set(value: T, opts?: TweenedOptions): Promise; ```
```dts update(updater: Updater, opts?: TweenedOptions): Promise; ```