@farris/ui-vue 1.0.0-beta.6 → 1.0.1

package/calendar/index.esm.js

@@ -0,0 +1,778 @@
+import { defineComponent as B, ref as g, computed as P, createVNode as t, resolveComponent as $, watch as A, onMounted as U } from "vue";
+const X = {
+  events: { Type: Array, default: [] },
+  firstDayOfTheWeek: { type: String, default: "Sun." }
+}, E = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+var N = /* @__PURE__ */ ((e) => (e[e.previous = 1] = "previous", e[e.current = 2] = "current", e[e.next = 3] = "next", e))(N || {});
+function Y() {
+  function e() {
+    return { year: 0, month: 0, day: 0 };
+  }
+  function w(r) {
+    return new Date(
+      r.year || 0,
+      r.month ? r.month - 1 : 0,
+      r.day || 0,
+      r.hour ? r.hour : 0,
+      r.minute ? r.minute : 0,
+      r.second ? r.second : 0,
+      0
+    );
+  }
+  function d(r) {
+    const M = /* @__PURE__ */ new Date();
+    return r.year || (r.year = M.getFullYear()), r.month || (r.month = M.getMonth() + 1), r.day || (r.day = 1), new Date(
+      r.year,
+      r.month - 1,
+      r.day,
+      r.hour ? r.hour : 0,
+      r.minute ? r.minute : 0,
+      r.second ? r.second : 0,
+      0
+    );
+  }
+  function I(r) {
+    return new Date(
+      r.year || 1,
+      (r.month || 1) - 1,
+      r.day,
+      r.hour ? r.hour : 0,
+      r.minute ? r.minute : 0,
+      r.second ? r.second : 0,
+      0
+    ).getDay();
+  }
+  function D(r) {
+    return E.indexOf(r);
+  }
+  function i(r) {
+    return w(r).getTime();
+  }
+  function f(r) {
+    return Math.round(i(r) / 1e3);
+  }
+  function s(r, M, T) {
+    const x = i(M), u = i(T), y = i(r);
+    return u - y > y - x ? M : T;
+  }
+  function m() {
+    const r = /* @__PURE__ */ new Date();
+    return {
+      year: r.getFullYear(),
+      month: r.getMonth() + 1,
+      day: r.getDate(),
+      hour: r.getHours(),
+      minute: r.getMinutes(),
+      second: r.getSeconds()
+    };
+  }
+  return { emptyDate: e, getDate: w, getDate2: d, getDayNumber: I, getEpocTime: f, getNearDate: s, getWeekdayIndex: D, getTimeInMilliseconds: i, getToday: m };
+}
+function Z() {
+  function e(i, f) {
+    return new Date(f, i, 0).getDate();
+  }
+  function w(i, f, s) {
+    return new Date(i, f - 1, s, 0, 0, 0, 0);
+  }
+  function d(i, f) {
+    const s = w(f, i, 1);
+    return s.setMonth(s.getMonth() - 1), e(s.getMonth() + 1, s.getFullYear());
+  }
+  function I(i, f) {
+    const s = {
+      year: i === 12 ? f + 1 : f
+    }, m = i === 12 ? 1 : i + 1;
+    return s.month = m, s;
+  }
+  function D(i, f) {
+    const s = {
+      year: i === 1 ? f - 1 : f
+    }, m = i === 1 ? 12 : i - 1;
+    return s.month = m, s;
+  }
+  return { daysInMonth: e, daysInPreMonth: d, getNextMonth: I, getPreviousMonth: D };
+}
+function K() {
+  const { getToday: e, getDayNumber: w } = Y(), { daysInMonth: d, daysInPreMonth: I, getNextMonth: D, getPreviousMonth: i } = Z();
+  function f(c) {
+    const h = E.indexOf(c);
+    return h > 0 ? 7 - h : 0;
+  }
+  function s(c) {
+    const { day: h, month: o, year: a } = c;
+    if (h === void 0 || o === void 0 || a === void 0)
+      throw new Error("invalided date.");
+    const n = h === 1, l = n ? I(o, a) : h - 1, v = n ? o - 1 : o, k = v < 1, p = k ? 12 : v;
+    return {
+      year: k ? a - 1 : a,
+      month: p,
+      day: l
+    };
+  }
+  function m(c) {
+    const { day: h, month: o, year: a } = c;
+    if (h === void 0 || o === void 0 || a === void 0)
+      throw new Error("invalided date.");
+    const n = d(o, a), l = h === n, v = l ? 1 : h + 1, k = l ? o + 1 : o, p = k > 12, C = p ? 1 : k;
+    return {
+      year: p ? a + 1 : a,
+      month: C,
+      day: v
+    };
+  }
+  function r(c) {
+    const h = i(c.month || 1, c.year || 1), o = d(h.month || 1, h.year || 1);
+    return {
+      day: (c.day || 1) <= o ? c.day : o,
+      month: h.month,
+      year: h.year
+    };
+  }
+  function M(c) {
+    const h = D(c.month || 1, c.year || 1), o = d(h.month || 1, h.year || 1);
+    return {
+      day: (c.day || 1) <= o ? c.day : o,
+      month: h.month,
+      year: h.year
+    };
+  }
+  function T(c) {
+    const o = (c.day || 1) - 7, a = o < 1, n = a ? d(c.month || 1, c.year || 1) + o : o, l = a ? i(c.month || 1, c.year || 1) : c;
+    return {
+      day: n,
+      month: l.month,
+      year: l.year
+    };
+  }
+  function x(c) {
+    const o = (c.day || 1) + 7, a = d(c.month || 1, c.year || 1), n = o > a, l = n ? o - a : o, v = n ? D(c.month || 1, c.year || 1) : c;
+    return {
+      day: l,
+      month: v.month,
+      year: v.year
+    };
+  }
+  function u(c, h, o, a) {
+    const n = { day: c, month: h, year: o }, v = f(a) === 0 ? 1 : 0, k = w(n) + v, p = e();
+    let C = s(n);
+    const O = [];
+    for (let W = k - 1; W >= 1; W--) {
+      const j = C.month !== n.month ? N.previous : N.current, R = C.month === h && C.day === p.day && C.month === p.month && C.year === p.year;
+      O.push({ date: C, monthTag: j, isCurrent: R }), W > 1 && (C = s(C));
+    }
+    let V = m(n);
+    const S = [];
+    for (let W = k + 1; W <= 7; W++) {
+      const j = C.month !== n.month ? N.next : N.current, R = V.day === p.day && V.month === p.month && V.year === p.year;
+      S.push({ date: V, monthTag: j, isCurrent: R }), W < 7 && (V = m(V));
+    }
+    const F = c === p.day && h === p.month && o === p.year;
+    return {
+      days: [...O.reverse(), { date: n, monthTag: N.current, isCurrent: F }, ...S],
+      weekNumber: 0,
+      year: o
+    };
+  }
+  function y(c, h, o) {
+    const a = [], n = d(c, h);
+    for (let l = 1; l <= n; l += 7) {
+      const v = u(l, c, h, o);
+      a.push(v);
+    }
+    return a;
+  }
+  return {
+    getMonthlyCalendar: y,
+    getWeeklyCalendar: u,
+    getPreviousDay: s,
+    getNextDay: m,
+    getDayInPreviousWeek: T,
+    getDayInNextWeek: x,
+    getDayInPreviousMonth: r,
+    getDayInNextMonth: M
+  };
+}
+function G() {
+  const { getTimeInMilliseconds: e } = Y();
+  function w(u) {
+    return u && u.year !== 0 && u.month !== 0 && u.day !== 0;
+  }
+  function d(u) {
+    return u && u.year !== 0 && u.month !== 0;
+  }
+  function I(u) {
+    return u && u.year !== 0;
+  }
+  function D(u, y) {
+    return e(u) < e(y);
+  }
+  function i(u, y) {
+    return e(u) <= e(y);
+  }
+  function f(u, y) {
+    return e(u) === e(y);
+  }
+  function s(u, y) {
+    const c = e(y);
+    return e(u.from) === c || e(u.to) === c;
+  }
+  function m(u, y) {
+    return !y || !w(y.to) || !w(y.from) ? !1 : i(y.from, u) && i(u, y.to);
+  }
+  function r(u, y) {
+    return w(y) && e(u) >= e(y);
+  }
+  function M(u, y) {
+    return w(y) && e(u) <= e(y);
+  }
+  function T(u, y) {
+    return e({ year: u.year, month: u.month, day: u.day }) === e({ year: y.year, month: y.month, day: y.day });
+  }
+  function x(u, y) {
+    return e({ hour: u.hour, minute: u.minute, second: u.second }) === e({ hour: y.hour, minute: y.minute, second: y.second });
+  }
+  return {
+    isDateEarlier: D,
+    equal: f,
+    inPeriod: m,
+    isPoint: s,
+    equalOrEarlier: i,
+    isInitializedDate: w,
+    isInitializedMonth: d,
+    isInitializedYear: I,
+    isMonthDisabledByDisableSince: r,
+    isMonthDisabledByDisableUntil: M,
+    sameTime: x,
+    sameDay: T
+  };
+}
+const Q = {
+  1: "Jan",
+  2: "Feb",
+  3: "Mar",
+  4: "Apr",
+  5: "May",
+  6: "Jun",
+  7: "Jul",
+  8: "Aug",
+  9: "Sep",
+  10: "Oct",
+  11: "Nov",
+  12: "Dec"
+}, q = /* @__PURE__ */ B({
+  name: "FCalendar",
+  props: X,
+  emits: [],
+  setup(e, w) {
+    const {
+      sameDay: d
+    } = G(), {
+      getToday: I
+    } = Y(), D = g(e.firstDayOfTheWeek), i = g(e.events), f = I(), s = g({
+      year: f.year || 1,
+      month: f.month || 1,
+      day: f.day || 1
+    }), m = g(3), {
+      getMonthlyCalendar: r,
+      getWeeklyCalendar: M,
+      getPreviousDay: T,
+      getNextDay: x,
+      getDayInPreviousWeek: u,
+      getDayInNextWeek: y,
+      getDayInPreviousMonth: c,
+      getDayInNextMonth: h
+    } = K(), o = P(() => `${Q[s.value.month || 1]} ${s.value.year}`), a = P(() => r(s.value.month || 1, s.value.year || 1, D.value)), n = P(() => M(s.value.day || 1, s.value.month || 1, s.value.year || 1, D.value)), l = P(() => n.value.days.find((b) => d(b.date, s.value)) || n.value.days[1]), v = P(() => {
+      const b = n.value.days.findIndex((j) => d(j.date, s.value)), W = b > -1 ? b : 1;
+      return E[W];
+    }), k = P(() => m.value === 3), p = P(() => m.value === 2), C = P(() => m.value === 1);
+    function O(b) {
+      m.value = b;
+    }
+    function V(b) {
+      b === 1 && (s.value = T(s.value)), b === 2 && (s.value = u(s.value)), b === 3 && (s.value = c(s.value));
+    }
+    function S(b) {
+      b === 1 && (s.value = x(s.value)), b === 2 && (s.value = y(s.value)), b === 3 && (s.value = h(s.value));
+    }
+    function F() {
+      s.value = {
+        year: f.year || 1,
+        month: f.month || 1,
+        day: f.day || 1
+      };
+    }
+    return () => t("div", {
+      class: "f-calendar"
+    }, [t($("f-calendar-header"), {
+      activeView: m.value,
+      title: o.value,
+      onViewChange: (b) => O(b),
+      onPrevious: (b) => V(b),
+      onNext: (b) => S(b),
+      onResetToToday: () => F()
+    }, null), t("div", null, [C.value && t($("f-calendar-day-view"), {
+      day: l.value,
+      dayInWeek: v.value,
+      events: i.value
+    }, null), p.value && t($("f-calendar-week-view"), {
+      week: n.value,
+      events: i.value
+    }, null), k.value && t($("f-calendar-month-view"), {
+      activeDay: s.value,
+      dates: a.value,
+      events: i.value
+    }, null)])]);
+  }
+}), ee = {
+  activeView: { Type: Number, default: 3 },
+  title: { Type: String, default: "" },
+  dailyViewTitle: { Type: String, default: "Day" },
+  weeklyViewTitle: { Type: String, default: "Week" },
+  monthlyViewTitle: { Type: String, default: "Month" }
+};
+const _ = /* @__PURE__ */ B({
+  name: "FCalendarHeader",
+  props: ee,
+  emits: ["ViewChange", "Previous", "Next", "ResetToToday"],
+  setup(e, w) {
+    const d = g(e.title), I = g(e.dailyViewTitle), D = g(e.weeklyViewTitle), i = g(e.monthlyViewTitle), f = 2, s = 62, m = g(e.activeView), r = g("Today");
+    A(() => e.title, () => {
+      d.value = e.title;
+    });
+    const M = P(() => ({
+      top: `${f}px`,
+      left: `${m.value * (f + 1) + (m.value - 1) * (s + 1)}px`
+    })), T = P(() => m.value === 1 ? I.value : m.value === 2 ? D.value : i.value);
+    function x() {
+      m.value = 1, w.emit("ViewChange", 1);
+    }
+    function u() {
+      m.value = 2, w.emit("ViewChange", 2);
+    }
+    function y() {
+      m.value = 3, w.emit("ViewChange", 3);
+    }
+    function c() {
+      w.emit("Previous", m.value);
+    }
+    function h() {
+      w.emit("Next", m.value);
+    }
+    function o() {
+      w.emit("ResetToToday");
+    }
+    return () => t("div", {
+      class: "f-calendar-header"
+    }, [t("div", {
+      class: "f-calendar-title"
+    }, [d.value]), t("div", {
+      class: "f-calendar-navigator"
+    }, [t("div", {
+      class: "f-calendar-navigator-today btn btn-default",
+      onClick: () => o()
+    }, [r.value]), t("div", {
+      class: "f-calendar-navigator-button-group"
+    }, [t("div", {
+      class: "f-calendar-navigator-previous btn btn-default",
+      onClick: () => c()
+    }, [t("i", {
+      class: "k-icon k-i-arrow-chevron-left"
+    }, null)]), t("div", {
+      class: "f-calendar-navigator-next btn btn-default",
+      onClick: () => h()
+    }, [t("i", {
+      class: "k-icon k-i-arrow-chevron-right"
+    }, null)])])]), t("div", {
+      class: "f-calendar-view-switch"
+    }, [t("div", {
+      class: "f-calendar-view-switch-panel"
+    }, [t("span", {
+      class: "f-calendar-view-switch-daily",
+      onClick: (a) => x()
+    }, [I.value]), t("span", {
+      class: "f-calendar-view-switch-weekly",
+      onClick: (a) => u()
+    }, [D.value]), t("span", {
+      class: "f-calendar-view-switch-monthly",
+      onClick: (a) => y()
+    }, [i.value])]), t("div", {
+      class: "f-calendar-view-switch-active-view",
+      style: M.value
+    }, [T.value])])]);
+  }
+}), ne = {
+  day: { Type: Object, default: {} },
+  dayInWeek: { Type: String, default: "" },
+  enableMarkCurrent: { Type: Boolean, default: !0 },
+  events: { Type: Array, default: [] }
+};
+const z = /* @__PURE__ */ B({
+  name: "FCalendarDayView",
+  props: ne,
+  emits: [],
+  setup(e, w) {
+    const d = g(), I = g(), D = g(e.dayInWeek), i = g(e.day), f = g(e.enableMarkCurrent), s = g(e.events), m = g([]), {
+      equal: r
+    } = G();
+    function M(n) {
+      const l = {
+        year: i.value.date.year,
+        month: i.value.date.month,
+        day: i.value.date.day,
+        hour: n.hour,
+        minute: n.minute,
+        second: n.second
+      }, v = s.value.filter((k) => r(k.starts, l));
+      return [{
+        day: l,
+        events: v
+      }];
+    }
+    function T() {
+      const n = [];
+      for (let l = 0; l < 24; l++) {
+        const v = {
+          hour: l,
+          minute: 0,
+          second: 0
+        }, k = {
+          hour: l,
+          minute: 30,
+          second: 0
+        }, p = M(v), C = M(k);
+        n.push({
+          time: v,
+          events: p,
+          title: l > 0 ? `${l}:00` : "",
+          part: "upper"
+        }), n.push({
+          time: k,
+          events: C,
+          title: `${l}:30`,
+          part: "lower"
+        });
+      }
+      m.value = n;
+    }
+    T(), A(() => e.day, () => {
+      i.value = e.day, T();
+    }), A(() => e.events, () => {
+      s.value = e.events, T();
+    });
+    const x = (n) => ({
+      "f-calendar-day-view-date": !0,
+      "f-calendar-day-view-current": n.isCurrent && f.value
+    });
+    function u() {
+      return t("div", {
+        class: "f-calendar-day-view-header"
+      }, [t("div", {
+        class: "f-calendar-day-view-header-corner"
+      }, null), t("div", {
+        class: "f-calendar-day-view-header-primary"
+      }, [t("div", {
+        class: "f-calendar-day-view-header-columns"
+      }, [t("div", {
+        class: "f-calendar-day-view-header-cell"
+      }, [t("div", {
+        class: x(i.value)
+      }, [i.value.date.day]), t("span", null, [D.value])])])])]);
+    }
+    function y() {
+      return t("div", {
+        class: "f-calendar-day-view-content-side"
+      }, [t("div", {
+        class: "f-calendar-side"
+      }, [m.value.map((n) => t("div", {
+        class: "f-calendar-side-row"
+      }, [t("div", {
+        class: "f-calendar-side-row-number"
+      }, [n.part === "upper" ? n.title : ""])]))])]);
+    }
+    function c(n) {
+      return {
+        "f-calendar-day-view-item": !0,
+        "f-calendar-day-view-item-upper": n.part === "upper",
+        "f-calendar-day-view-item-lower": n.part === "lower"
+      };
+    }
+    function h(n) {
+      const O = (n.starts.hour || 0) + (n.starts.minute || 0) / 60;
+      return {
+        height: `${44 * ((n.ends.hour || 0) + (n.ends.minute || 0) / 60 - O) - 2 - 2 - 1 - 1}px`
+      };
+    }
+    function o() {
+      return m.value.map((n) => t("div", {
+        class: c(n)
+      }, [n.events.map((l) => t("div", {
+        class: "f-calendar-day-view-item-cell"
+      }, [l.events.length > 0 && l.events.map((v) => t("div", {
+        class: "f-calendar-event",
+        style: h(v)
+      }, [v.title]))]))]));
+    }
+    function a() {
+      return t("div", {
+        ref: I,
+        class: "f-calendar-content-primary"
+      }, [t("div", {
+        class: "f-calendar-content-data"
+      }, [o()])]);
+    }
+    return U(() => {
+      d.value && d.value.scrollTo(0, 250);
+    }), () => t("div", {
+      class: "f-calendar-day-view"
+    }, [u(), t("div", {
+      class: "f-calendar-day-view-content",
+      ref: d
+    }, [y(), a()])]);
+  }
+}), te = {
+  dates: { Type: Array, default: [] },
+  daysInWeek: { Type: Array, default: E },
+  enableKeyboadNavigate: { Type: Boolean, default: !0 },
+  enableMarkCurrent: { Type: Boolean, default: !0 },
+  events: { Type: Array, default: [] },
+  activeDay: { Type: Object, default: null }
+};
+var H = /* @__PURE__ */ ((e) => (e[e.enter = 13] = "enter", e[e.esc = 27] = "esc", e[e.space = 32] = "space", e[e.leftArrow = 37] = "leftArrow", e[e.upArrow = 38] = "upArrow", e[e.rightArrow = 39] = "rightArrow", e[e.downArrow = 40] = "downArrow", e[e.tab = 9] = "tab", e[e.shift = 16] = "shift", e))(H || {});
+function ae() {
+  function e(w) {
+    const d = w.key || w.keyCode;
+    return d === "Enter" || d === 13 ? 13 : d === "Escape" || d === 27 ? 27 : d === " " || d === 32 ? 32 : d === "ArrowLeft" || d === 37 ? 37 : d === "ArrowUp" || d === 38 ? 38 : d === "ArrowRight" || d === 39 ? 39 : d === "ArrowDown" || d === 40 ? 40 : d === "Tab" || d === 9 ? 9 : d === "Shift" || d === 16 ? 16 : -1;
+  }
+  return { getKeyCodeFromEvent: e };
+}
+const J = /* @__PURE__ */ B({
+  name: "FCalendarMonthView",
+  props: te,
+  emits: [],
+  setup(e, w) {
+    const d = g(e.daysInWeek), I = g(e.enableKeyboadNavigate), D = g(e.enableMarkCurrent), i = g(e.activeDay), f = g(e.events), {
+      equal: s,
+      sameDay: m
+    } = G(), {
+      getKeyCodeFromEvent: r
+    } = ae();
+    function M(o, a) {
+      return o.forEach((n) => {
+        n.days.forEach((l) => {
+          const v = a.filter((k) => m(k.starts, l.date));
+          v && v.length && (l.events = [...v]);
+        });
+      }), o;
+    }
+    const T = g(M(e.dates, f.value));
+    A(() => e.dates, () => {
+      T.value = M(e.dates, f.value);
+    }), A(() => e.activeDay, () => {
+      i.value = e.activeDay;
+    }), A(() => e.events, () => {
+      f.value = e.events;
+    });
+    function x(o) {
+      return !!i.value && s({
+        year: i.value.year,
+        month: i.value.month,
+        day: i.value.day
+      }, o);
+    }
+    const u = (o, a, n) => {
+      const v = {
+        "f-datepicker-no-currmonth": o.monthTag === N.previous || o.monthTag === N.next
+      }, k = `d_${a}_${n}`;
+      return v[k] = !0, v;
+    }, y = (o) => {
+      const a = o.monthTag === N.current && x(o.date), n = o.isCurrent && D.value;
+      return {
+        "f-calendar-month-view-date": !0,
+        "f-calendar-month-view-selected": a,
+        "f-calendar-month-view-current": n
+      };
+    };
+    function c(o, a) {
+      o.stopPropagation(), w.emit("click", a.date);
+    }
+    function h(o, a) {
+      const n = r(o);
+      n !== H.tab && (o.preventDefault(), n === H.enter || n === H.space ? c(o, a) : I.value && w.emit("keyDown", a.date));
+    }
+    return () => t("div", {
+      class: "f-calendar-month-view"
+    }, [t("table", {
+      class: "f-datepicker-table",
+      cellpadding: "0"
+    }, [t("thead", null, [t("tr", null, [d.value && d.value.map((o) => t("th", {
+      scope: "col",
+      style: "padding: 4px 4px 8px"
+    }, [o]))])]), t("tbody", null, [T.value && T.value.map((o, a) => t("tr", null, [o.days && o.days.map((n, l) => t("td", {
+      id: `d_${a}_${l}`,
+      tabindex: "0",
+      class: u(n, a, l),
+      onClick: (v) => c(v, n),
+      onKeydown: (v) => h(v, n)
+    }, [t("div", {
+      class: "f-calendar-month-view-title"
+    }, [t("div", {
+      class: y(n)
+    }, [n.date.day]), t("div", {
+      class: "f-calendar-month-view-date-month"
+    }, [n.date.day === 1 ? Q[n.date.month || 1] : ""])]), n.events && n.events.length && n.events.map((v) => t("div", {
+      class: "f-calendar-month-view-event-item"
+    }, [v.title]))]))]))])])]);
+  }
+}), re = {
+  daysInWeek: { Type: Array, default: E },
+  enableMarkCurrent: { Type: Boolean, default: !0 },
+  events: { Type: Array, default: [] },
+  week: { Type: Object, default: { days: [], weekNumber: 0, year: 0 } }
+};
+const L = /* @__PURE__ */ B({
+  name: "FCalendarWeekView",
+  props: re,
+  emits: [],
+  setup(e) {
+    const w = g(), d = g(), I = g(e.daysInWeek), D = g(e.week), i = g(e.enableMarkCurrent), f = g(e.events), s = g([]), {
+      equal: m
+    } = G();
+    function r(a) {
+      return D.value.days.map((l) => {
+        const v = {
+          year: l.date.year,
+          month: l.date.month,
+          day: l.date.day,
+          hour: a.hour,
+          minute: a.minute,
+          second: a.second
+        }, k = f.value.filter((p) => m(p.starts, v));
+        return {
+          day: v,
+          events: k
+        };
+      });
+    }
+    function M() {
+      const a = [];
+      for (let n = 0; n < 24; n++) {
+        const l = {
+          hour: n,
+          minute: 0,
+          second: 0
+        }, v = {
+          hour: n,
+          minute: 30,
+          second: 0
+        }, k = r(l), p = r(v);
+        a.push({
+          time: l,
+          events: k,
+          title: n > 0 ? `${n}:00` : "",
+          part: "upper"
+        }), a.push({
+          time: v,
+          events: p,
+          title: `${n}:30`,
+          part: "lower"
+        });
+      }
+      s.value = a;
+    }
+    M(), A(() => e.week, () => {
+      D.value = e.week, M();
+    }), A(() => e.events, () => {
+      f.value = e.events, M();
+    });
+    const T = (a) => ({
+      "f-calendar-week-view-date": !0,
+      "f-calendar-week-view-current": a.isCurrent && i.value
+    });
+    function x() {
+      return t("div", {
+        class: "f-calendar-week-view-header"
+      }, [t("div", {
+        class: "f-calendar-week-view-header-corner"
+      }, null), t("div", {
+        class: "f-calendar-week-view-header-primary"
+      }, [t("div", {
+        class: "f-calendar-week-view-header-columns"
+      }, [I.value.map((a, n) => t("div", {
+        class: "f-calendar-week-view-header-cell"
+      }, [t("div", {
+        class: T(D.value.days[n])
+      }, [D.value.days[n].date.day]), t("span", null, [a])]))])])]);
+    }
+    function u() {
+      return t("div", {
+        class: "f-calendar-week-view-content-side"
+      }, [t("div", {
+        class: "f-calendar-side"
+      }, [s.value.map((a) => t("div", {
+        class: "f-calendar-side-row"
+      }, [t("div", {
+        class: "f-calendar-side-row-number"
+      }, [a.part === "upper" ? a.title : ""])]))])]);
+    }
+    function y(a) {
+      return {
+        "f-calendar-week-view-item": !0,
+        "f-calendar-week-view-item-upper": a.part === "upper",
+        "f-calendar-week-view-item-lower": a.part === "lower"
+      };
+    }
+    function c(a) {
+      const C = (a.starts.hour || 0) + (a.starts.minute || 0) / 60;
+      return {
+        height: `${44 * ((a.ends.hour || 0) + (a.ends.minute || 0) / 60 - C) - 2 - 2 - 1 - 1}px`
+      };
+    }
+    function h() {
+      return s.value.map((a) => t("div", {
+        class: y(a)
+      }, [a.events.map((n) => t("div", {
+        class: "f-calendar-week-view-item-cell"
+      }, [n.events.length > 0 && n.events.map((l) => t("div", {
+        class: "f-calendar-event",
+        style: c(l)
+      }, [l.title]))]))]));
+    }
+    function o() {
+      return t("div", {
+        ref: d,
+        class: "f-calendar-content-primary"
+      }, [t("div", {
+        class: "f-calendar-content-data"
+      }, [h()])]);
+    }
+    return U(() => {
+      w.value && w.value.scrollTo(0, 250);
+    }), () => t("div", {
+      class: "f-calendar-week-view"
+    }, [x(), t("div", {
+      class: "f-calendar-week-view-content",
+      ref: w
+    }, [u(), o()])]);
+  }
+}), se = {
+  install(e) {
+    e.component(q.name, q).component(z.name, z).component(_.name, _).component(J.name, J).component(L.name, L);
+  }
+};
+export {
+  q as Calendar,
+  z as CalendarDayView,
+  _ as CalendarHeader,
+  J as CalendarMonthView,
+  L as CalendarWeekView,
+  N as MonthTag,
+  X as calendarProps,
+  ne as dayViewProps,
+  se as default,
+  Q as defaultNameOfMonths,
+  ee as headerProps,
+  te as monthViewProps,
+  E as weekDays,
+  re as weekViewProps
+};