import exoTypes from '@myadbox/nebula-template-utils'
import 'react'

export interface Libs extends Record<string, unknown> {
  gsap?: GSAP
  GSDevTools?: GSDevTools
}

export type Config = exoTypes.Config
export type AssetOutput = exoTypes.AssetOutput
export type Choice = exoTypes.Choice

/**
 * Array that has at least one member
 */
export type ArrayOneOrMore<T> = Array<T> & {
  0: T
}

export type BaseProps = React.ComponentPropsWithoutRef<`div`> & {
  tag?: string
  style?: React.CSSProperties
}

/**
 * A SemVer version number, without a preceeding `v`.
 * @example
 *  `3.9.1`
 */
export type Version = `${number}.${number}.${number}`

export interface TemplateProps {
  /**
   * values passed from user input
   */
  content?: Record<string, unknown>
  /**
   * the url of the template’s current page directory used to compute `baseUrl`
   */
  templateUrl?: string
  /**
   * the url of the template root directory used to compute `root`
   */
  templateRoot?: string
  /**
   * values of a specific template page
   */
  page?: Record<string, unknown>
  /**
   * translated values
   */
  localeValues?: Record<string, unknown>
  /**
   * setting this to false will disable the animation and set `is-static` on the body class. Which can be used to hide or show elements, thereby creating how the static version of the otherwise animated template should look. This is done through the Hucssley classes `is-static__visibility:visible` and `visibility:hidden` which you can set on elements that should be hidden prior to animation, but shown in the static version of the template.
   */
  cancelAnimation?: boolean
  /**
   * a record of the libraries used in an animation script
   */
  libs?: Libs
  /**
   * A specific version of GSAP to use for a template. This is useful if have added GSAP plugins to the animation/libs folder, as they can require a matching version of GSAP core to be used. Beware though, you must make sure the version you choose is being served from the CDN. See https://support.google.com/richmedia/answer/6307288?hl=en
   * @example
   *  `3.9.1`
   */
  gsapVersion?: Version
}

/**
 * The type of the template component exported from the main template jsx file.
 */
export type ExoTemplate = (props: TemplateProps) => JSX.Element

/**
 * The type of the full animation exported from the animation script. It may include a libs property which is a record of the extra libraries used in the animation script.
 */
export type ExoAnimation = (gsap: GSAP & {libs: Record<string, never>}) => gsap.core.Timeline

/**
 * A reuseable partial GSAP timeline that can be applied to any element.
 */
export type ElementTimeline = (el: gsap.TweenTarget, ...args) => gsap.core.Timeline