import { __assign } from 'tslib';
import { withThemeableProps } from '../../../useThemeable.js';
import { classNamesFunction } from '@uifabric-vue/utilities';
import Vue from 'vue';
import { CalendarYearTitle } from './CalendarYearTitle.js';
import { CalendarYearNav } from './CalendarYearNav.js';
import { withCalendarYearRangeProps } from './useCalendarYear.js';

var getClassNames = classNamesFunction();
var CalendarYearHeader = Vue.extend({
  name: "CalendarYearHeader",
  functional: true,
  props: __assign(__assign(__assign({}, withThemeableProps()), withCalendarYearRangeProps()), { animateBackwards: { type: Boolean, default: false }, animationDirection: { type: Number, default: void 0 } }),
  render: function(h, ctx) {
    var _a, _b, _c;
    var _d = ctx.props, styles = _d.styles, theme = _d.theme, className = _d.className, animateBackwards = _d.animateBackwards, animationDirection = _d.animationDirection;
    var classNames = getClassNames(styles, {
      theme: theme,
      className: className,
      hasHeaderClickCallback: !!ctx.listeners.onHeaderSelect,
      animateBackwards: animateBackwards,
      animationDirection: animationDirection
    });
    return h("div", { class: classNames.headerContainer }, [
      (_c = (_b = (_a = ctx.scopedSlots).onRenderTitle) === null || _b === void 0 ? void 0 : _b.call(_a, ctx.props)) !== null && _c !== void 0 ? _c : h(CalendarYearTitle, __assign({}, ctx.data)),
      h(CalendarYearNav, __assign({}, ctx.data))
    ]);
  }
});

export { CalendarYearHeader };
