useCrossFadeTransition

function useCrossFadeTransition<E extends HTMLElement>(
  options: CrossFadeTransitionHookOptions<E> = {}
): CSSTransitionHookReturnValue<E>;

export interface CrossFadeTransitionHookOptions<E extends HTMLElement>
  extends PreconfiguredCSSTransitionInDefaultedOptions<E> {
  /**
   * @see {@link TransitionTimeout}
   * @see {@link CROSS_FADE_TIMEOUT}
   * @defaultValue `CROSS_FADE_TIMEOUT`
   */
  timeout?: TransitionTimeout;

  /**
   * @see {@link CSSTransitionClassNames}
   * @see {@link CROSS_FADE_CLASSNAMES}
   * @defaultValue `CROSS_FADE_CLASSNAMES`
   */
  classNames?: CSSTransitionClassNames;

  /**
   * @see {@link PreconfiguredCSSTransitionInDefaultedOptions.transitionIn}
   * @defaultValue `true`
   */
  transitionIn?: boolean;
}

export const CROSS_FADE_TIMEOUT: Readonly<TransitionTimeoutObject> = {
  appear: 300,
  enter: 300,
  exit: 0,
};

export const CROSS_FADE_CLASSNAMES: Readonly<CSSTransitionClassNamesObject> = {
  appear: "rmd-cross-fade",
  appearActive: "rmd-cross-fade--active",
  enter: "rmd-cross-fade",
  enterActive: "rmd-cross-fade--active",
};