[]previous and next page

ViewTransitionProps

Props of ViewTransition.

Props of ViewTransition.

Import#

ts
import type { ViewTransitionProps } from "@shadow-js/web";

Signature#

ts
interface ViewTransitionProps {
  /**
   * The transition name (`view-transition-name`). Elements with the same name in the old and the new
   * screen are animated as one (`share`); an element that appears or disappears with a name animates
   * in (`enter`) or out (`exit`). `true` makes a unique name.
   * @default undefined (no inline `view-transition-name` is set on the element)
   */
  readonly name?: string | true;
  /**
   * The transition class (`view-transition-class`), to style a group of named elements at once.
   * @default undefined (no inline `view-transition-class` is set)
   */
  readonly class?: string;
  /**
   * The content. Its first element receives the name and class.
   * @default undefined (renders nothing)
   */
  readonly children?: unknown;
}

Members#

Name Type Description
name? readonly name?: string | true The transition name (view-transition-name). Elements with the same name in the old and the new screen are animated as one (share); an element that appears or disappears with a name animates in (enter) or out (exit). true makes a unique name.
class? readonly class?: string The transition class (view-transition-class), to style a group of named elements at once.
children? readonly children?: unknown The content. Its first element receives the name and class.