@gez/date-time-kit/dist/components/calendar/index.mjs

var __freeze = Object.freeze;
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
var __template = (cooked, raw) => __freeze(__defProp(cooked, "raw", { value: __freeze(raw || cooked.slice()) }));
var _a, _b, _c;
import { closestByEvent } from "../../utils/index.mjs";
import {
  UiBase
} from "../web-component-base/index.mjs";
import styleStr from "./index.css.mjs";
import html from "./index.html.mjs";
import { getWeekInOrder, weekKey } from "./weeks.mjs";
export { weekKey, getWeekInOrder } from "./weeks.mjs";
export class Ele extends UiBase {
  constructor() {
    super(...arguments);
    __publicField(this, "_onWeekStartAtChange", super._genRenderFn(() => {
      const weekOrder = getWeekInOrder(this.weekStartAt);
      this._els.weeks.forEach((ele, i) => {
        ele.setAttribute("i18n-key", "date.".concat(weekOrder[i]));
      });
      this._onTimeChange();
    }));
    __publicField(this, "_onTimeChange", super._genRenderFn(() => {
      const currentTime = this.showingTime;
      let timeStart = this.timeStart;
      let timeEnd = this.timeEnd;
      currentTime.setHours(0, 0, 0, 0);
      timeStart.setHours(0, 0, 0, 0);
      timeEnd.setHours(0, 0, 0, 0);
      if (Number.isNaN(+currentTime) || Number.isNaN(+timeStart) || Number.isNaN(+timeEnd)) {
        console.warn("Invalid date attribute(s) on <".concat(this.tagName, ">"));
        return;
      }
      if (timeStart > timeEnd) {
        [timeStart, timeEnd] = [timeEnd, timeStart];
      }
      const minTime = this.minTime;
      const maxTime = this.maxTime;
      minTime.setHours(0, 0, 0, 0);
      maxTime.setHours(0, 0, 0, 0);
      if (maxTime < timeEnd) timeEnd = maxTime;
      if (timeStart < minTime) timeStart = minTime;
      const weekStartAt = this.weekStartAt;
      const year = currentTime.getFullYear();
      const month = currentTime.getMonth();
      const days = new Date(year, month + 1, 0).getDate();
      const daysPrev = new Date(year, month, 0).getDate();
      const firstWeekOfCurMonth = new Date(year, month, 1).getDay();
      const weekStartOffset = weekKey.indexOf(weekStartAt);
      const adjustedFirstWeek = (firstWeekOfCurMonth - weekStartOffset + 7) % 7;
      let itemIdx = 0;
      const items = this._els.items;
      const changeItemText = (item, text) => {
        item.querySelector("span").textContent = text;
      };
      items.forEach((ele) => {
        ele.className = "item disabled";
        ele.removeAttribute("data-time");
        ele.setAttribute("part", "item disabled");
        changeItemText(ele, " ");
      });
      for (let i = daysPrev - adjustedFirstWeek + 1; i <= daysPrev; ++i) {
        const ele = items[itemIdx++];
        ele.classList.add("prev");
        ele.part.add("prev");
        changeItemText(ele, this.showOtherMonth ? this.formatter(i) : " ");
      }
      for (let i = 1; i <= days; ++i) {
        const ele = items[itemIdx++];
        const time = new Date(year, month, i);
        ele.classList.toggle("month-start", i === 1);
        ele.classList.toggle("month-end", i === days);
        ele.classList.toggle("disabled", time < minTime || time > maxTime);
        ele.classList.toggle("start", +time === +timeStart);
        ele.classList.toggle(
          "in-range",
          +time >= +timeStart && +time <= +timeEnd
        );
        ele.classList.toggle("end", +time === +timeEnd);
        ele.setAttribute("part", ele.className);
        ele.dataset.time = time.toISOString();
        changeItemText(ele, this.formatter(i));
      }
      const inRangeItem = items.filter(
        (e) => e.classList.contains("in-range")
      );
      if (inRangeItem.length) {
        inRangeItem[0].classList.add("range-start");
        inRangeItem[0].part.add("range-start");
        inRangeItem[inRangeItem.length - 1].classList.add("range-end");
        inRangeItem[inRangeItem.length - 1].part.add("range-end");
      }
      for (let i = 1; itemIdx < items.length; ++i) {
        const ele = items[itemIdx++];
        ele.classList.add("next");
        ele.part.add("next");
        changeItemText(ele, this.showOtherMonth ? this.formatter(i) : " ");
      }
    }));
    __publicField(this, "_onClick", (e) => {
      const item = closestByEvent(e, ".item[data-time]:not(.disabled)", this);
      if (!item) return;
      const time = new Date(item.dataset.time);
      super.dispatchEvent("select-time", time, true);
    });
    __publicField(this, "_onPointerOver", (e) => {
      const item = closestByEvent(e, ".item[data-time]:not(.disabled)", this);
      if (!item) return;
      const time = new Date(item.dataset.time);
      super.dispatchEvent("hover-item", time, true);
    });
    __publicField(this, "formatter", (i) => (i < 10 ? "0" : "") + i);
  }
  static get observedAttributes() {
    return [
      ...super.observedAttributes,
      "showing-time",
      "time-start",
      "time-end",
      "min-time",
      "max-time",
      "week-start-at"
    ];
  }
  get _staticEls() {
    return {
      ...super._staticEls,
      weeks: this.$(_a || (_a = __template([".week"]))),
      items: this.$(_b || (_b = __template([".item"])))
    };
  }
  get showingTime() {
    const v = this._getAttr("showing-time", "" + Date.now());
    return new Date(Number.isNaN(+v) ? v : +v);
  }
  get timeStart() {
    const v = this._getAttr("time-start", "" + this.showingTime);
    return new Date(Number.isNaN(+v) ? v : +v);
  }
  get timeEnd() {
    const v = this._getAttr("time-end", "" + this.timeStart);
    return new Date(Number.isNaN(+v) ? v : +v);
  }
  get minTime() {
    const v = this._getAttr("min-time", "null");
    return new Date(Number.isNaN(+v) ? v : +v);
  }
  get maxTime() {
    const v = this._getAttr("max-time", "null");
    return new Date(Number.isNaN(+v) ? v : +v);
  }
  _setTimeAttr(name, value) {
    const v = new Date(value);
    if (Number.isNaN(+v)) return;
    this.setAttribute(name, +v + "");
  }
  set showingTime(val) {
    this._setTimeAttr("showing-time", val);
  }
  set timeStart(val) {
    this._setTimeAttr("time-start", val);
  }
  set timeEnd(val) {
    this._setTimeAttr("time-end", val);
  }
  set minTime(val) {
    this._setTimeAttr("min-time", val);
  }
  set maxTime(val) {
    this._setTimeAttr("max-time", val);
  }
  get weekStartAt() {
    return this._getAttr("week-start-at", "sun");
  }
  set weekStartAt(val) {
    if (!weekKey.includes(val)) return;
    this.setAttribute("week-start-at", val);
  }
  get showOtherMonth() {
    return this.hasAttribute("show-other-month");
  }
  set showOtherMonth(val) {
    this.setAttribute("show-other-month", "" + val);
  }
  connectedCallback() {
    if (!super.connectedCallback()) return;
    this._onWeekStartAtChange();
    this._onTimeChange();
    this._bindEvt(this)("click", this._onClick);
    this._bindEvt(_c || (_c = __template([".wrapper"])))("pointerover", this._onPointerOver);
  }
  _onAttrChanged(name, oldValue, newValue) {
    super._onAttrChanged(name, oldValue, newValue);
    if (name === "week-start-at") {
      this._onWeekStartAtChange();
    }
    if ([
      "showing-time",
      "time-start",
      "time-end",
      "min-time",
      "max-time"
    ].includes(name)) {
      this._onTimeChange();
    }
  }
}
__publicField(Ele, "tagName", "dt-calendar-base");
__publicField(Ele, "_style", styleStr);
__publicField(Ele, "_template", html);
Ele.define();