'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-7cdf1df1.js');
const moment = require('./moment-d48a0164.js');

function getTheClickedDate(previousDates, newDates) {
  if (previousDates.length < newDates.length) {
    // means the user clicked a date that was not selected before
    // find the date that is not already in existing dates
    return newDates.find(d => !previousDates.find(ca => ca.toISOString() === d.toISOString()));
  }
  // means the user clicked a date that was highlighted
  // find the date that's in existing dates but not in the new dates
  return previousDates.find(ca => !newDates.find(d => ca.toISOString() === d.toISOString()));
}

const takvimAvailableTimePickerCss = "takvim-available-time-picker .selected-day-container{flex:1;margin-left:1rem !important;max-height:253px}takvim-available-time-picker .selected-day-container .selected-day-availabilities dvn-card{margin:0 0 0.5rem 0;text-align:center;font-size:0.9em}";

const generateSlotsForAvailability = (_availability) => {
  return [
    { start: '9:00 AM', end: '10:00 AM' },
    { start: '12:00 AM', end: '13:00 PM' },
    { start: '13:00 PM', end: '14:00 PM' },
    { start: '14:00 PM', end: '15:00 PM' },
  ];
};
const TakvimAvailableTimePicker = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.availabilitiesForTheSelectedDate = [];
    this.availabilities = [
      { duration: 30, date: new Date(), availabilities: [{ start: '9:00 AM', end: '6:00 PM' }] },
      { duration: 30, date: new Date(2020, 10, 27), availabilities: [{ start: '9:00 AM', end: '6:00 PM' }] },
      { duration: 30, date: new Date(2020, 11, 23), availabilities: [{ start: '10:00 AM', end: '6:00 PM' }] },
      { duration: 60, date: new Date(2020, 11, 23), availabilities: [{ start: '11:00 AM', end: '6:00 PM' }] },
      { duration: 30, date: new Date(2020, 11, 11), availabilities: [{ start: '12:00 AM', end: '6:00 PM' }] },
    ];
    this.onSelectDate = (event) => {
      const value = event.detail;
      const { availabilities } = this;
      const existingDates = availabilities.map(ca => ca.date);
      this.selectedDate = getTheClickedDate(existingDates, value);
      this.availabilitiesForTheSelectedDate = availabilities
        .filter(ca => { var _a; return ca.date.toISOString() === ((_a = this.selectedDate) === null || _a === void 0 ? void 0 : _a.toISOString()); });
      if (this.availabilitiesForTheSelectedDate.length === 0) {
        this.selectedDate = undefined;
        this.selectedAvailability = undefined;
      }
      else if (this.availabilitiesForTheSelectedDate.length === 1) {
        // select the first available date
        this.selectedAvailability = this.availabilitiesForTheSelectedDate[0];
      }
      else {
        this.selectedAvailability = undefined;
      }
    };
  }
  render() {
    const { availabilities, availabilitiesForTheSelectedDate, selectedAvailability, selectedDate } = this;
    return (index.h(index.Host, { class: "d-flex" }, index.h("dvn-date-picker", { embedded: true, leaned: true, multiple: true, value: availabilities.map(ca => ca.date), onChange: this.onSelectDate }), selectedDate &&
      index.h("dvn-card", { class: "selected-day-container", elevation: 0, leaned: true }, index.h("dvn-card-header", { title: moment.hooks(selectedDate).format('DD MMMM YYYY'), slot: "header", separated: false }), index.h("div", { class: "selected-day-availabilities" }, !selectedAvailability && availabilitiesForTheSelectedDate.map(a => (index.h("dvn-card", { elevation: 0, outlined: true, selectable: true, onClick: () => this.selectedAvailability = a }, "Book a ", a.duration, " min call"))), selectedAvailability && generateSlotsForAvailability().map(slot => (index.h("dvn-card", { elevation: 0, outlined: true, selectable: true }, slot.start, " - ", slot.end)))))));
  }
};
TakvimAvailableTimePicker.style = takvimAvailableTimePickerCss;

exports.takvim_available_time_picker = TakvimAvailableTimePicker;
