'use strict';

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

const index = require('./index-140bcbcd.js');
const index$1 = require('./index-b7de914b.js');
require('./_commonjsHelpers-537d719a.js');

const styleCss = ".sc-smoothly-input-date-range-h{position:relative;display:block}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-range-h>div.sc-smoothly-input-date-range{position:fixed;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range>.arrow.sc-smoothly-input-date-range{position:absolute;z-index:9;-webkit-transform:translate(10em, -.55em) rotate(45deg);transform:translate(10em, -.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}.sc-smoothly-input-date-range-h>smoothly-input.sc-smoothly-input-date-range{padding:0}";

const InputDateRange = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.valueChanged = index.createEvent(this, "valueChanged", 7);
  }
  onValue(next) {
    this.valueChanged.emit(next);
  }
  onStartChanged(event) {
    this.start = event.detail;
  }
  onEndChanged(event) {
    this.end = event.detail;
  }
  render() {
    var _a;
    return [
      index.h("section", null, index.h("smoothly-input", { onClick: () => (this.open = !this.open), type: "date", value: this.start, onSmoothlyChanged: e => (this.start = e.detail.value) }, "From"), index.h("smoothly-input", { onClick: () => (this.open = !this.open), type: "date", value: this.end, onSmoothlyChanged: e => (this.end = e.detail.value) }, "to")),
      this.open ? index.h("div", { onClick: () => (this.open = false) }) : [],
      this.open ? (index.h("nav", null, index.h("div", { class: "arrow" }), index.h("smoothly-calendar", { doubleInput: true, value: (_a = this.value) !== null && _a !== void 0 ? _a : index$1.dist.Date.now(), onValueChanged: event => {
          this.value = event.detail;
          event.stopPropagation();
        } }))) : ([]),
    ];
  }
  static get watchers() { return {
    "value": ["onValue"]
  }; }
};
InputDateRange.style = styleCss;

exports.smoothly_input_date_range = InputDateRange;
