import React from 'react';

import { Styles } from '@cleartrip/ct-design-types';
import { EntranceAnimationProps } from './components/EntranceAnimation';

export interface AnimationStyleProps {
  /**
   * The content to be displayed within the accordion.
   */
  children?: React.ReactNode;

  /**
   * If true, the accordion is in an open state.
   */
  animate?: boolean;
  /**
   * Style configuration for different parts of the accordion.
   */
  styleConfig?: {
    /**
     * Style configuration for the root container of the accordion.
     */
    root?: Styles[];
  };
}

export interface StretchyAnimationProps {
  /**
   * The content to be displayed within the stretchy animation.
   */
  children: React.ReactNode;
  /**
   * The dynamic height of the stretchy animation.
   */
  dynamicHeight: number;
  /**
   * If true, the stretchy animation will only be applied on iOS.
   */
  iosOnly?: boolean;
}

export type AnimateProps =
  | ({ variant: 'SHAKE' } & AnimationStyleProps)
  | ({ variant: 'ENTRANCE_ANIMATION' } & EntranceAnimationProps)
  | ({ variant: 'STRETCHY_ANIMATION' } & StretchyAnimationProps);