{"version":3,"file":"barba-css.mjs","sources":["../src/css.ts"],"sourcesContent":["/**\n * @barba/css\n * <br><br>\n * ## Barba CSS.\n *\n * - Add CSS classes\n * - Manage CSS transitions\n *\n * @module css\n * @preferred\n */\n\n/***/\n\n// Definitions\nimport {\n  IBarbaPlugin,\n  ITransitionData,\n  ITransitionPage,\n} from '@barba/core/src/defs';\n\nimport { Core } from '@barba/core/src/core';\nimport { Logger } from '@barba/core/src/modules/Logger';\n\nimport { ICssCallbacks } from './defs';\n\nimport { version } from '../package.json';\n\nexport class Css implements IBarbaPlugin<{}> {\n  public name = '@barba/css';\n  public version = version;\n  public barba: Core;\n  public logger: Logger;\n\n  public prefix: string = 'barba';\n  public callbacks: ICssCallbacks = {};\n  public cb: any;\n\n  // Check if transition property applied\n  private _hasTransition: boolean = false;\n\n  /**\n   * Plugin installation.\n   */\n  public install(barba: Core) {\n    this.logger = new barba.Logger(this.name);\n    this.logger.info(this.version);\n    this.barba = barba;\n    this._once = this._once.bind(this);\n    this._leave = this._leave.bind(this);\n    this._enter = this._enter.bind(this);\n  }\n\n  /**\n   * Plugin installation.\n   */\n  public init() {\n    // Register hooks to get prefix\n    this.barba.hooks.before(this._getPrefix, this);\n    this.barba.hooks.beforeOnce(this._getPrefix, this);\n\n    // Register hook for CSS classes\n    this.barba.hooks.beforeOnce(this._beforeOnce, this);\n    this.barba.hooks.afterOnce(this._afterOnce, this);\n    this.barba.hooks.beforeLeave(this._beforeLeave, this);\n    this.barba.hooks.afterLeave(this._afterLeave, this);\n    this.barba.hooks.beforeEnter(this._beforeEnter, this);\n    this.barba.hooks.afterEnter(this._afterEnter, this);\n\n    // Override main transitions\n    this.barba.transitions.once = this._once;\n    this.barba.transitions.leave = this._leave;\n    this.barba.transitions.enter = this._enter;\n\n    // Add empty default transition (force prepend)\n    /* istanbul ignore next */\n    this.barba.transitions.store.all.unshift({\n      name: 'barba',\n      once() {}, // tslint:disable-line:no-empty\n      leave() {}, // tslint:disable-line:no-empty\n      enter() {}, // tslint:disable-line:no-empty\n    });\n    this.barba.transitions.store.update();\n  }\n\n  /**\n   * Initial state.\n   */\n  public async start(container: HTMLElement, kind: string): Promise<void> {\n    // Set initial CSS values\n    this.add(container, kind); // CSS: add kind\n    await this.barba.helpers.nextTick();\n    // Apply CSS transition\n    this.add(container, `${kind}-active`); // CSS: add kind-active\n    await this.barba.helpers.nextTick();\n  }\n\n  /**\n   * Next frame state.\n   */\n  public async next(container: HTMLElement, kind: string): Promise<any> {\n    this._hasTransition = this._checkTransition(container);\n\n    if (this._hasTransition) {\n      // We need to listen the end of the animation\n      return new Promise(async resolve => {\n        this.cb = resolve;\n        this.callbacks[kind] = resolve;\n\n        container.addEventListener('transitionend', resolve, false);\n        this.remove(container, kind); // CSS: remove kind\n        await this.barba.helpers.nextTick();\n        this.add(container, `${kind}-to`); // CSS: add kind-to\n        await this.barba.helpers.nextTick();\n      });\n    } else {\n      this.remove(container, kind); // CSS: remove kind\n      await this.barba.helpers.nextTick();\n      this.add(container, `${kind}-to`); // CSS: add kind-to\n      await this.barba.helpers.nextTick();\n    }\n  }\n\n  /**\n   * Final state.\n   */\n  public async end(container: HTMLElement, kind: string): Promise<void> {\n    this.remove(container, `${kind}-to`); // CSS: remove kind-to\n    this.remove(container, `${kind}-active`); // CSS: remove kind-active\n    container.removeEventListener('transitionend', this.callbacks[kind]);\n    this._hasTransition = false;\n  }\n\n  /**\n   * Add CSS classes.\n   */\n  public add(el: HTMLElement, step: string): void {\n    el.classList.add(`${this.prefix}-${step}`);\n  }\n\n  /**\n   * Remove CSS classes.\n   */\n  public remove(el: HTMLElement, step: string): void {\n    el.classList.remove(`${this.prefix}-${step}`);\n  }\n\n  /**\n   * Get CSS prefix from transition `name` property.\n   */\n  private _getPrefix(data: ITransitionData, t: ITransitionPage): void {\n    this.prefix = t.name || 'barba';\n  }\n\n  /**\n   * Check if CSS transition is applied\n   */\n  private _checkTransition(container: HTMLElement) {\n    // DEV: check for CSS animation property?\n    return getComputedStyle(container).transitionDuration !== '0s';\n  }\n\n  /**\n   * `beforeOnce` hook.\n   */\n  private _beforeOnce(data: ITransitionData): Promise<void> {\n    return this.start(data.next.container, 'once');\n  }\n\n  /**\n   * `once` hook.\n   */\n  private async _once(\n    data: ITransitionData,\n    t: ITransitionPage\n  ): Promise<any> {\n    await this.barba.hooks.do('once', data, t);\n\n    return this.next(data.next.container, 'once');\n  }\n\n  /**\n   * `afterOnce` hook.\n   */\n  private _afterOnce(data: ITransitionData): Promise<void> {\n    return this.end(data.next.container, 'once');\n  }\n\n  /**\n   * `beforeLeave` hook.\n   */\n  private _beforeLeave(data: ITransitionData): Promise<void> {\n    return this.start(data.current.container, 'leave');\n  }\n\n  /**\n   * `leave` hook.\n   */\n  private async _leave(\n    data: ITransitionData,\n    t: ITransitionPage\n  ): Promise<void> {\n    await this.barba.hooks.do('leave', data, t);\n\n    return this.next(data.current.container, 'leave');\n  }\n\n  /**\n   * `afterLeave` hook.\n   */\n  private _afterLeave(data: ITransitionData): Promise<void> {\n    this.end(data.current.container, 'leave');\n    // For CSS transitions, we need to remove current container\n    // directly after the leave transition\n    this.barba.transitions.remove(data);\n\n    return Promise.resolve();\n  }\n\n  /**\n   * `beforeEnter` hook.\n   */\n  private _beforeEnter(data: ITransitionData): Promise<void> {\n    return this.start(data.next.container, 'enter');\n  }\n\n  /**\n   * `enter` hook.\n   */\n  private async _enter(\n    data: ITransitionData,\n    t: ITransitionPage\n  ): Promise<void> {\n    await this.barba.hooks.do('enter', data, t);\n\n    return this.next(data.next.container, 'enter');\n  }\n\n  /**\n   * `afterEnter` hook.\n   */\n  private _afterEnter(data: ITransitionData): Promise<void> {\n    return this.end(data.next.container, 'enter');\n  }\n}\n\nconst css = new Css();\n\nexport default css;\n"],"names":["css","Css","this","name","version","barba","logger","prefix","callbacks","cb","_hasTransition","_proto","prototype","install","Logger","info","_once","bind","_leave","_enter","init","hooks","before","_getPrefix","beforeOnce","_beforeOnce","afterOnce","_afterOnce","beforeLeave","_beforeLeave","afterLeave","_afterLeave","beforeEnter","_beforeEnter","afterEnter","_afterEnter","transitions","once","leave","enter","store","all","unshift","update","start","container","kind","_this","add","Promise","resolve","helpers","nextTick","then","next","_this2","_checkTransition","addEventListener","remove","end","_this3","removeEventListener","el","step","classList","data","t","transitionDuration","_this4","e","reject","current","_this5","_this6"],"mappings":"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"}