@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
1,137 lines (1,136 loc) • 33.8 kB
JavaScript
import { defineComponent as R, ref as T, watch as B, computed as S, createVNode as c, onMounted as J, inject as le } from "vue";
import { isPlainObject as Z, cloneDeep as K } from "lodash-es";
const ee = {}, ne = {};
function U(e) {
const { properties: n, title: u, ignore: v } = e, i = v && Array.isArray(v), l = Object.keys(n).reduce((r, s) => ((!i || !v.find((k) => k === s)) && (r[s] = n[s].type === "object" && n[s].properties ? U(n[s]) : K(n[s].default)), r), {});
if (u && (!i || !v.find((r) => r === "id"))) {
const r = u.toLowerCase().replace(/-/g, "_");
l.id = `${r}_${Math.random().toString().slice(2, 6)}`;
}
return l;
}
function ue(e) {
const { properties: n, title: u, required: v } = e;
if (v && Array.isArray(v)) {
const i = v.reduce((l, r) => (l[r] = n[r].type === "object" && n[r].properties ? U(n[r]) : K(n[r].default), l), {});
if (u && v.find((l) => l === "id")) {
const l = u.toLowerCase().replace(/-/g, "_");
i.id = `${l}_${Math.random().toString().slice(2, 6)}`;
}
return i;
}
return {
type: u
};
}
function te(e, n = {}, u) {
const v = ee[e];
if (v) {
let i = ue(v);
const l = ne[e];
return i = l ? l({ getSchemaByType: te }, i, n, u) : i, i;
}
return null;
}
function ie(e, n) {
const u = U(n);
return Object.keys(u).reduce((v, i) => (Object.prototype.hasOwnProperty.call(e, i) && (v[i] && Z(v[i]) && Z(e[i] || !e[i]) ? Object.assign(v[i], e[i] || {}) : v[i] = e[i]), v), u), u;
}
function ae(e, n) {
return Object.keys(e).filter((v) => e[v] != null).reduce((v, i) => {
if (n.has(i)) {
const l = n.get(i);
if (typeof l == "string")
v[l] = e[i];
else {
const r = l(i, e[i], e);
Object.assign(v, r);
}
} else
v[i] = e[i];
return v;
}, {});
}
function de(e, n, u = /* @__PURE__ */ new Map()) {
const v = ie(e, n);
return ae(v, u);
}
function ye(e = {}) {
function n(t, m, w, M) {
if (typeof w == "number")
return M[t].length === w;
if (typeof w == "object") {
const d = Object.keys(w)[0], f = w[d];
if (d === "not")
return Number(M[t].length) !== Number(f);
if (d === "moreThan")
return Number(M[t].length) >= Number(f);
if (d === "lessThan")
return Number(M[t].length) <= Number(f);
}
return !1;
}
function u(t, m, w, M) {
return M[t] && M[t].propertyValue && String(M[t].propertyValue.value) === String(w);
}
const v = /* @__PURE__ */ new Map([
["length", n],
["getProperty", u]
]);
Object.keys(e).reduce((t, m) => (t.set(m, e[m]), t), v);
function i(t, m) {
const w = t;
return typeof m == "number" ? [{ target: w, operator: "length", param: null, value: Number(m) }] : typeof m == "boolean" ? [{ target: w, operator: "getProperty", param: t, value: !!m }] : typeof m == "object" ? Object.keys(m).map((M) => {
if (M === "length")
return { target: w, operator: "length", param: null, value: m[M] };
const d = M, f = m[M];
return { target: w, operator: "getProperty", param: d, value: f };
}) : [];
}
function l(t) {
return Object.keys(t).reduce((w, M) => {
const d = i(M, t[M]);
return w.push(...d), w;
}, []);
}
function r(t, m) {
if (v.has(t.operator)) {
const w = v.get(t.operator);
return w && w(t.target, t.param, t.value, m) || !1;
}
return !1;
}
function s(t, m) {
return l(t).reduce((d, f) => d && r(f, m), !0);
}
function k(t, m) {
const w = Object.keys(t), M = w.includes("allOf"), d = w.includes("anyOf"), f = M || d, y = (f ? t[f ? M ? "allOf" : "anyOf" : "allOf"] : [t]).map((o) => s(o, m));
return M ? !y.includes(!1) : y.includes(!0);
}
return { parseValueSchema: k };
}
const ve = {}, fe = {};
ye();
function he(e, n, u = /* @__PURE__ */ new Map(), v = (r, s, k, t) => s, i = {}, l = (r) => r) {
return ee[n.title] = n, ne[n.title] = v, ve[n.title] = i, fe[n.title] = l, (r = {}, s = !0) => {
if (!s)
return ae(r, u);
const k = de(r, n, u), t = Object.keys(e).reduce((m, w) => (m[w] = e[w].default, m), {});
return Object.assign(t, k);
};
}
function me(e, n) {
return { customClass: n.class, customStyle: n.style };
}
const pe = /* @__PURE__ */ new Map([
["appearance", me]
]);
function we(e, n, u) {
return n;
}
const ge = "https://json-schema.org/draft/2020-12/schema", ke = "https://farris-design.gitee.io/calendar.schema.json", De = "calendar", be = "A Farris Input Component", Me = "object", Te = {
id: {
description: "The unique identifier for calendar",
type: "string"
},
type: {
description: "The type string of calendar",
type: "string",
default: "calendar"
},
appearance: {
description: "",
type: "object",
properties: {
class: {
type: "string"
},
style: {
type: "string"
}
},
default: {}
}
}, Pe = [
"id",
"type"
], Ve = {
$schema: ge,
$id: ke,
title: De,
description: be,
type: Me,
properties: Te,
required: Pe
}, Ne = "calendar", Oe = "A Farris Component", We = "object", Ce = {
basic: {
description: "Basic Infomation",
title: "基本信息",
properties: {
id: {
description: "组件标识",
title: "标识",
type: "string",
readonly: !0
},
type: {
description: "组件类型",
title: "控件类型",
type: "select",
editor: {
type: "waiting for modification",
enum: []
}
}
}
}
}, Se = {
title: Ne,
description: Oe,
type: We,
categories: Ce
}, Q = {
events: { Type: Array, default: [] },
firstDayOfTheWeek: { type: String, default: "Sun." }
}, re = he(Q, Ve, pe, we, Se), F = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var $ = /* @__PURE__ */ ((e) => (e[e.previous = 1] = "previous", e[e.current = 2] = "current", e[e.next = 3] = "next", e))($ || {});
function z() {
function e() {
return { year: 0, month: 0, day: 0 };
}
function n(t) {
return new Date(
t.year || 0,
t.month ? t.month - 1 : 0,
t.day || 0,
t.hour ? t.hour : 0,
t.minute ? t.minute : 0,
t.second ? t.second : 0,
0
);
}
function u(t) {
const m = /* @__PURE__ */ new Date();
return t.year || (t.year = m.getFullYear()), t.month || (t.month = m.getMonth() + 1), t.day || (t.day = 1), new Date(
t.year,
t.month - 1,
t.day,
t.hour ? t.hour : 0,
t.minute ? t.minute : 0,
t.second ? t.second : 0,
0
);
}
function v(t) {
return new Date(
t.year || 1,
(t.month || 1) - 1,
t.day,
t.hour ? t.hour : 0,
t.minute ? t.minute : 0,
t.second ? t.second : 0,
0
).getDay();
}
function i(t) {
return F.indexOf(t);
}
function l(t) {
return n(t).getTime();
}
function r(t) {
return Math.round(l(t) / 1e3);
}
function s(t, m, w) {
const M = l(m), d = l(w), f = l(t);
return d - f > f - M ? m : w;
}
function k() {
const t = /* @__PURE__ */ new Date();
return {
year: t.getFullYear(),
month: t.getMonth() + 1,
day: t.getDate(),
hour: t.getHours(),
minute: t.getMinutes(),
second: t.getSeconds()
};
}
return { emptyDate: e, getDate: n, getDate2: u, getDayNumber: v, getEpocTime: r, getNearDate: s, getWeekdayIndex: i, getTimeInMilliseconds: l, getToday: k };
}
function je() {
function e(l, r) {
return new Date(r, l, 0).getDate();
}
function n(l, r, s) {
return new Date(l, r - 1, s, 0, 0, 0, 0);
}
function u(l, r) {
const s = n(r, l, 1);
return s.setMonth(s.getMonth() - 1), e(s.getMonth() + 1, s.getFullYear());
}
function v(l, r) {
const s = {
year: l === 12 ? r + 1 : r
}, k = l === 12 ? 1 : l + 1;
return s.month = k, s;
}
function i(l, r) {
const s = {
year: l === 1 ? r - 1 : r
}, k = l === 1 ? 12 : l - 1;
return s.month = k, s;
}
return { daysInMonth: e, daysInPreMonth: u, getNextMonth: v, getPreviousMonth: i };
}
function oe() {
const { getToday: e, getDayNumber: n } = z(), { daysInMonth: u, daysInPreMonth: v, getNextMonth: i, getPreviousMonth: l } = je();
function r(h) {
const D = F.indexOf(h);
return D > 0 ? 7 - D : 0;
}
function s(h) {
const { day: D, month: y, year: a } = h;
if (D === void 0 || y === void 0 || a === void 0)
throw new Error("invalided date.");
const o = D === 1, g = o ? v(y, a) : D - 1, b = o ? y - 1 : y, V = b < 1, p = V ? 12 : b;
return {
year: V ? a - 1 : a,
month: p,
day: g
};
}
function k(h) {
const { day: D, month: y, year: a } = h;
if (D === void 0 || y === void 0 || a === void 0)
throw new Error("invalided date.");
const o = u(y, a), g = D === o, b = g ? 1 : D + 1, V = g ? y + 1 : y, p = V > 12, P = p ? 1 : V;
return {
year: p ? a + 1 : a,
month: P,
day: b
};
}
function t(h) {
const D = l(h.month || 1, h.year || 1), y = u(D.month || 1, D.year || 1);
return {
day: (h.day || 1) <= y ? h.day : y,
month: D.month,
year: D.year
};
}
function m(h) {
const D = i(h.month || 1, h.year || 1), y = u(D.month || 1, D.year || 1);
return {
day: (h.day || 1) <= y ? h.day : y,
month: D.month,
year: D.year
};
}
function w(h) {
const y = (h.day || 1) - 7, a = y < 1, o = a ? u(h.month || 1, h.year || 1) + y : y, g = a ? l(h.month || 1, h.year || 1) : h;
return {
day: o,
month: g.month,
year: g.year
};
}
function M(h) {
const y = (h.day || 1) + 7, a = u(h.month || 1, h.year || 1), o = y > a, g = o ? y - a : y, b = o ? i(h.month || 1, h.year || 1) : h;
return {
day: g,
month: b.month,
year: b.year
};
}
function d(h, D, y, a) {
const o = { day: h, month: D, year: y }, b = r(a) === 0 ? 1 : 0, V = n(o) + b, p = e();
let P = s(o);
const N = [];
for (let A = V - 1; A >= 1; A--) {
const I = P.month !== o.month ? $.previous : $.current, C = P.month === D && P.day === p.day && P.month === p.month && P.year === p.year;
N.push({ date: P, monthTag: I, isCurrent: C }), A > 1 && (P = s(P));
}
let O = k(o);
const j = [];
for (let A = V + 1; A <= 7; A++) {
const I = P.month !== o.month ? $.next : $.current, C = O.day === p.day && O.month === p.month && O.year === p.year;
j.push({ date: O, monthTag: I, isCurrent: C }), A < 7 && (O = k(O));
}
const W = h === p.day && D === p.month && y === p.year;
return {
days: [...N.reverse(), { date: o, monthTag: $.current, isCurrent: W }, ...j],
weekNumber: 0,
year: y
};
}
function f(h, D, y) {
const a = [], o = u(h, D);
for (let g = 1; g <= o; g += 7) {
const b = d(g, h, D, y);
a.push(b);
}
return a;
}
return {
getMonthlyCalendar: f,
getWeeklyCalendar: d,
getPreviousDay: s,
getNextDay: k,
getDayInPreviousWeek: w,
getDayInNextWeek: M,
getDayInPreviousMonth: t,
getDayInNextMonth: m
};
}
function q() {
const { getTimeInMilliseconds: e } = z();
function n(d) {
return d && d.year !== 0 && d.month !== 0 && d.day !== 0;
}
function u(d) {
return d && d.year !== 0 && d.month !== 0;
}
function v(d) {
return d && d.year !== 0;
}
function i(d, f) {
return e(d) < e(f);
}
function l(d, f) {
return e(d) <= e(f);
}
function r(d, f) {
return e(d) === e(f);
}
function s(d, f) {
const h = e(f);
return e(d.from) === h || e(d.to) === h;
}
function k(d, f) {
return !f || !n(f.to) || !n(f.from) ? !1 : l(f.from, d) && l(d, f.to);
}
function t(d, f) {
return n(f) && e(d) >= e(f);
}
function m(d, f) {
return n(f) && e(d) <= e(f);
}
function w(d, f) {
return e({ year: d.year, month: d.month, day: d.day }) === e({ year: f.year, month: f.month, day: f.day });
}
function M(d, f) {
return e({ hour: d.hour, minute: d.minute, second: d.second }) === e({ hour: f.hour, minute: f.minute, second: f.second });
}
return {
isDateEarlier: i,
equal: r,
inPeriod: k,
isPoint: s,
equalOrEarlier: l,
isInitializedDate: n,
isInitializedMonth: u,
isInitializedYear: v,
isMonthDisabledByDisableSince: t,
isMonthDisabledByDisableUntil: m,
sameTime: M,
sameDay: w
};
}
const X = {
1: "Jan",
2: "Feb",
3: "Mar",
4: "Apr",
5: "May",
6: "Jun",
7: "Jul",
8: "Aug",
9: "Sep",
10: "Oct",
11: "Nov",
12: "Dec"
}, Ae = {
activeView: { Type: Number, default: 3 },
title: { Type: String, default: "" },
dailyViewTitle: { Type: String, default: "Day" },
weeklyViewTitle: { Type: String, default: "Week" },
monthlyViewTitle: { Type: String, default: "Month" }
}, G = /* @__PURE__ */ R({
name: "FCalendarHeader",
props: Ae,
emits: ["ViewChange", "Previous", "Next", "ResetToToday"],
setup(e, n) {
const u = T(e.title), v = T(e.dailyViewTitle), i = T(e.weeklyViewTitle), l = T(e.monthlyViewTitle), r = 2, s = 62, k = T(e.activeView), t = T("Today");
B(() => e.title, () => {
u.value = e.title;
});
const m = S(() => ({
top: `${r}px`,
left: `${k.value * (r + 1) + (k.value - 1) * (s + 1)}px`
})), w = S(() => k.value === 1 ? v.value : k.value === 2 ? i.value : l.value);
function M() {
k.value = 1, n.emit("ViewChange", 1);
}
function d() {
k.value = 2, n.emit("ViewChange", 2);
}
function f() {
k.value = 3, n.emit("ViewChange", 3);
}
function h() {
n.emit("Previous", k.value);
}
function D() {
n.emit("Next", k.value);
}
function y() {
n.emit("ResetToToday");
}
return () => c("div", {
class: "f-calendar-header"
}, [c("div", {
class: "f-calendar-title"
}, [u.value]), c("div", {
class: "f-calendar-navigator"
}, [c("div", {
class: "f-calendar-navigator-today btn btn-default",
onClick: () => y()
}, [t.value]), c("div", {
class: "f-calendar-navigator-button-group"
}, [c("div", {
class: "f-calendar-navigator-previous btn btn-default",
onClick: () => h()
}, [c("i", {
class: "f-icon f-icon-arrow-chevron-left"
}, null)]), c("div", {
class: "f-calendar-navigator-next btn btn-default",
onClick: () => D()
}, [c("i", {
class: "f-icon f-icon-arrow-chevron-right"
}, null)])])]), c("div", {
class: "f-calendar-view-switch"
}, [c("div", {
class: "f-calendar-view-switch-panel"
}, [c("span", {
class: "f-calendar-view-switch-daily",
onClick: (a) => M()
}, [v.value]), c("span", {
class: "f-calendar-view-switch-weekly",
onClick: (a) => d()
}, [i.value]), c("span", {
class: "f-calendar-view-switch-monthly",
onClick: (a) => f()
}, [l.value])]), c("div", {
class: "f-calendar-view-switch-active-view",
style: m.value
}, [w.value])])]);
}
}), $e = {
dates: { Type: Array, default: [] },
daysInWeek: { Type: Array, default: F },
enableKeyboadNavigate: { Type: Boolean, default: !0 },
enableMarkCurrent: { Type: Boolean, default: !0 },
events: { Type: Array, default: [] },
activeDay: { Type: Object, default: null }
};
var _ = /* @__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))(_ || {});
function Be() {
function e(n) {
const u = n.key || n.keyCode;
return u === "Enter" || u === 13 ? 13 : u === "Escape" || u === 27 ? 27 : u === " " || u === 32 ? 32 : u === "ArrowLeft" || u === 37 ? 37 : u === "ArrowUp" || u === 38 ? 38 : u === "ArrowRight" || u === 39 ? 39 : u === "ArrowDown" || u === 40 ? 40 : u === "Tab" || u === 9 ? 9 : u === "Shift" || u === 16 ? 16 : -1;
}
return { getKeyCodeFromEvent: e };
}
const L = /* @__PURE__ */ R({
name: "FCalendarMonthView",
props: $e,
emits: ["click", "keyDown"],
setup(e, n) {
const u = T(e.daysInWeek), v = T(e.enableKeyboadNavigate), i = T(e.enableMarkCurrent), l = T(e.activeDay), r = T(e.events), {
equal: s,
sameDay: k
} = q(), {
getKeyCodeFromEvent: t
} = Be();
function m(y, a) {
return y.forEach((o) => {
o.days.forEach((g) => {
const b = a.filter((V) => k(V.starts, g.date));
b && b.length && (g.events = [...b]);
});
}), y;
}
const w = T(m(e.dates, r.value));
B(() => e.dates, () => {
w.value = m(e.dates, r.value);
}), B(() => e.activeDay, () => {
l.value = e.activeDay;
}), B(() => e.events, () => {
r.value = e.events;
});
function M(y) {
return !!l.value && s({
year: l.value.year,
month: l.value.month,
day: l.value.day
}, y);
}
const d = (y, a, o) => {
const b = {
"f-datepicker-no-currmonth": y.monthTag === $.previous || y.monthTag === $.next
}, V = `d_${a}_${o}`;
return b[V] = !0, b;
}, f = (y) => {
const a = y.monthTag === $.current && M(y.date), o = y.isCurrent && i.value;
return {
"f-calendar-month-view-date": !0,
"f-calendar-month-view-selected": a,
"f-calendar-month-view-current": o
};
};
function h(y, a) {
y.stopPropagation(), n.emit("click", a.date);
}
function D(y, a) {
const o = t(y);
o !== _.tab && (y.preventDefault(), o === _.enter || o === _.space ? h(y, a) : v.value && n.emit("keyDown", a.date));
}
return () => c("div", {
class: "f-calendar-month-view"
}, [c("table", {
class: "f-datepicker-table",
cellpadding: "0"
}, [c("thead", null, [c("tr", null, [u.value && u.value.map((y) => c("th", {
scope: "col",
style: "padding: 4px 4px 8px"
}, [y]))])]), c("tbody", null, [w.value && w.value.map((y, a) => c("tr", null, [y.days && y.days.map((o, g) => c("td", {
id: `d_${a}_${g}`,
tabindex: "0",
class: d(o, a, g),
onClick: (b) => h(b, o),
onKeydown: (b) => D(b, o)
}, [c("div", {
class: "f-calendar-month-view-title"
}, [c("div", {
class: f(o)
}, [o.date.day]), c("div", {
class: "f-calendar-month-view-date-month"
}, [o.date.day === 1 ? X[o.date.month || 1] : ""])]), o.events && o.events.length && o.events.map((b) => c("div", {
class: "f-calendar-month-view-event-item"
}, [b.title]))]))]))])])]);
}
}), Ee = {
daysInWeek: { Type: Array, default: F },
enableMarkCurrent: { Type: Boolean, default: !0 },
events: { Type: Array, default: [] },
week: { Type: Object, default: { days: [], weekNumber: 0, year: 0 } }
}, Y = /* @__PURE__ */ R({
name: "FCalendarWeekView",
props: Ee,
emits: [],
setup(e) {
const n = T(), u = T(), v = T(e.daysInWeek), i = T(e.week), l = T(e.enableMarkCurrent), r = T(e.events), s = T([]), {
equal: k
} = q();
function t(a) {
return i.value.days.map((g) => {
const b = {
year: g.date.year,
month: g.date.month,
day: g.date.day,
hour: a.hour,
minute: a.minute,
second: a.second
}, V = r.value.filter((p) => k(p.starts, b));
return {
day: b,
events: V
};
});
}
function m() {
const a = [];
for (let o = 0; o < 24; o++) {
const g = {
hour: o,
minute: 0,
second: 0
}, b = {
hour: o,
minute: 30,
second: 0
}, V = t(g), p = t(b);
a.push({
time: g,
events: V,
title: o > 0 ? `${o}:00` : "",
part: "upper"
}), a.push({
time: b,
events: p,
title: `${o}:30`,
part: "lower"
});
}
s.value = a;
}
m(), B(() => e.week, () => {
i.value = e.week, m();
}), B(() => e.events, () => {
r.value = e.events, m();
});
const w = (a) => ({
"f-calendar-week-view-date": !0,
"f-calendar-week-view-current": a.isCurrent && l.value
});
function M() {
return c("div", {
class: "f-calendar-week-view-header"
}, [c("div", {
class: "f-calendar-week-view-header-corner"
}, null), c("div", {
class: "f-calendar-week-view-header-primary"
}, [c("div", {
class: "f-calendar-week-view-header-columns"
}, [v.value.map((a, o) => c("div", {
class: "f-calendar-week-view-header-cell"
}, [c("div", {
class: w(i.value.days[o])
}, [i.value.days[o].date.day]), c("span", null, [a])]))])])]);
}
function d() {
return c("div", {
class: "f-calendar-week-view-content-side"
}, [c("div", {
class: "f-calendar-side"
}, [s.value.map((a) => c("div", {
class: "f-calendar-side-row"
}, [c("div", {
class: "f-calendar-side-row-number"
}, [a.part === "upper" ? a.title : ""])]))])]);
}
function f(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 h(a) {
const P = (a.starts.hour || 0) + (a.starts.minute || 0) / 60;
return {
height: `${44 * ((a.ends.hour || 0) + (a.ends.minute || 0) / 60 - P) - 2 - 2 - 1 - 1}px`
};
}
function D() {
return s.value.map((a) => c("div", {
class: f(a)
}, [a.events.map((o) => c("div", {
class: "f-calendar-week-view-item-cell"
}, [o.events.length > 0 && o.events.map((g) => c("div", {
class: "f-calendar-event",
style: h(g)
}, [g.title]))]))]));
}
function y() {
return c("div", {
ref: u,
class: "f-calendar-content-primary"
}, [c("div", {
class: "f-calendar-content-data"
}, [D()])]);
}
return J(() => {
n.value && n.value.scrollTo(0, 250);
}), () => c("div", {
class: "f-calendar-week-view"
}, [M(), c("div", {
class: "f-calendar-week-view-content",
ref: n
}, [d(), y()])]);
}
}), Re = {
day: { Type: Object, default: {} },
dayInWeek: { Type: String, default: "" },
enableMarkCurrent: { Type: Boolean, default: !0 },
events: { Type: Array, default: [] }
}, x = /* @__PURE__ */ R({
name: "FCalendarDayView",
props: Re,
emits: [],
setup(e) {
const n = T(), u = T(), v = T(e.dayInWeek), i = T(e.day), l = T(e.enableMarkCurrent), r = T(e.events), s = T([]), {
equal: k
} = q();
function t(a) {
const o = {
year: i.value.date.year,
month: i.value.date.month,
day: i.value.date.day,
hour: a.hour,
minute: a.minute,
second: a.second
}, g = r.value.filter((b) => k(b.starts, o));
return [{
day: o,
events: g
}];
}
function m() {
const a = [];
for (let o = 0; o < 24; o++) {
const g = {
hour: o,
minute: 0,
second: 0
}, b = {
hour: o,
minute: 30,
second: 0
}, V = t(g), p = t(b);
a.push({
time: g,
events: V,
title: o > 0 ? `${o}:00` : "",
part: "upper"
}), a.push({
time: b,
events: p,
title: `${o}:30`,
part: "lower"
});
}
s.value = a;
}
m(), B(() => e.day, () => {
i.value = e.day, m();
}), B(() => e.events, () => {
r.value = e.events, m();
});
const w = (a) => ({
"f-calendar-day-view-date": !0,
"f-calendar-day-view-current": a.isCurrent && l.value
});
function M() {
return c("div", {
class: "f-calendar-day-view-header"
}, [c("div", {
class: "f-calendar-day-view-header-corner"
}, null), c("div", {
class: "f-calendar-day-view-header-primary"
}, [c("div", {
class: "f-calendar-day-view-header-columns"
}, [c("div", {
class: "f-calendar-day-view-header-cell"
}, [c("div", {
class: w(i.value)
}, [i.value.date.day]), c("span", null, [v.value])])])])]);
}
function d() {
return c("div", {
class: "f-calendar-day-view-content-side"
}, [c("div", {
class: "f-calendar-side"
}, [s.value.map((a) => c("div", {
class: "f-calendar-side-row"
}, [c("div", {
class: "f-calendar-side-row-number"
}, [a.part === "upper" ? a.title : ""])]))])]);
}
function f(a) {
return {
"f-calendar-day-view-item": !0,
"f-calendar-day-view-item-upper": a.part === "upper",
"f-calendar-day-view-item-lower": a.part === "lower"
};
}
function h(a) {
const P = (a.starts.hour || 0) + (a.starts.minute || 0) / 60;
return {
height: `${44 * ((a.ends.hour || 0) + (a.ends.minute || 0) / 60 - P) - 2 - 2 - 1 - 1}px`
};
}
function D() {
return s.value.map((a) => c("div", {
class: f(a)
}, [a.events.map((o) => c("div", {
class: "f-calendar-day-view-item-cell"
}, [o.events.length > 0 && o.events.map((g) => c("div", {
class: "f-calendar-event",
style: h(g)
}, [g.title]))]))]));
}
function y() {
return c("div", {
ref: u,
class: "f-calendar-content-primary"
}, [c("div", {
class: "f-calendar-content-data"
}, [D()])]);
}
return J(() => {
n.value && n.value.scrollTo(0, 250);
}), () => c("div", {
class: "f-calendar-day-view"
}, [M(), c("div", {
class: "f-calendar-day-view-content",
ref: n
}, [d(), y()])]);
}
}), E = /* @__PURE__ */ R({
name: "FCalendar",
props: Q,
emits: [],
setup(e) {
const {
sameDay: n
} = q(), {
getToday: u
} = z(), v = T(e.firstDayOfTheWeek), i = T(e.events), l = u(), r = T({
year: l.year || 1,
month: l.month || 1,
day: l.day || 1
}), s = T(3), {
getMonthlyCalendar: k,
getWeeklyCalendar: t,
getPreviousDay: m,
getNextDay: w,
getDayInPreviousWeek: M,
getDayInNextWeek: d,
getDayInPreviousMonth: f,
getDayInNextMonth: h
} = oe(), D = S(() => `${X[r.value.month || 1]} ${r.value.year}`), y = S(() => k(r.value.month || 1, r.value.year || 1, v.value)), a = S(() => t(r.value.day || 1, r.value.month || 1, r.value.year || 1, v.value)), o = S(() => a.value.days.find((W) => n(W.date, r.value)) || a.value.days[1]), g = S(() => {
const W = a.value.days.findIndex((A) => n(A.date, r.value)), H = W > -1 ? W : 1;
return F[H];
}), b = S(() => s.value === 3), V = S(() => s.value === 2), p = S(() => s.value === 1);
function P(W) {
s.value = W;
}
function N(W) {
W === 1 && (r.value = m(r.value)), W === 2 && (r.value = M(r.value)), W === 3 && (r.value = f(r.value));
}
function O(W) {
W === 1 && (r.value = w(r.value)), W === 2 && (r.value = d(r.value)), W === 3 && (r.value = h(r.value));
}
function j() {
r.value = {
year: l.year || 1,
month: l.month || 1,
day: l.day || 1
};
}
return () => c("div", {
class: "f-calendar"
}, [c(G, {
activeView: s.value,
title: D.value,
onViewChange: (W) => P(W),
onPrevious: (W) => N(W),
onNext: (W) => O(W),
onResetToToday: () => j()
}, null), c("div", null, [p.value && c(x, {
day: o.value,
dayInWeek: g.value,
events: i.value
}, null), V.value && c(Y, {
week: a.value,
events: i.value
}, null), b.value && c(L, {
activeDay: r.value,
dates: y.value,
events: i.value
}, null)])]);
}
});
function Fe(e, n, u) {
var V;
const v = "", i = "", l = T();
function r() {
return (n == null ? void 0 : n.schema.componentType) !== "frame";
}
function s() {
return !1;
}
function k() {
return (n == null ? void 0 : n.schema.componentType) !== "frame";
}
function t() {
return (n == null ? void 0 : n.schema.componentType) === "frame";
}
function m(p) {
if (!p || !p.value)
return null;
if (p.value.schema && p.value.schema.type === "component")
return p.value;
const P = T(p == null ? void 0 : p.value.parent), N = m(P);
return N || null;
}
function w(p = n) {
var j;
const { componentInstance: P, designerItemElementRef: N } = p;
if (!P || !P.value)
return null;
const { getCustomButtons: O } = P.value;
return P.value.canMove || O && ((j = O()) != null && j.length) ? N : w(p.parent);
}
function M(p) {
return !!u;
}
function d() {
return (n == null ? void 0 : n.schema.label) || (n == null ? void 0 : n.schema.title) || (n == null ? void 0 : n.schema.name);
}
function f() {
}
function h(p, P) {
var N;
!p || !P || (N = n == null ? void 0 : n.setupContext) == null || N.emit("dragEnd");
}
function D(p, P) {
const { componentType: N } = p;
let O = te(N, p, P);
const j = N.toLowerCase().replace(/-/g, "_");
return O && !O.id && O.type === N && (O.id = `${j}_${Math.random().toString().slice(2, 6)}`), O;
}
function y(p) {
}
function a(...p) {
}
function o() {
n != null && n.schema.contents && n.schema.contents.map((p) => {
let P = p.id;
p.type === "component-ref" && (P = p.component);
const N = e.value.querySelectorAll(`#${P}-design-item`);
N != null && N.length && Array.from(N).map((O) => {
var j;
(j = O == null ? void 0 : O.componentInstance) != null && j.value.onRemoveComponent && O.componentInstance.value.onRemoveComponent();
});
});
}
function g() {
}
function b(p) {
}
return l.value = {
canMove: r(),
canSelectParent: s(),
canDelete: k(),
canNested: !t(),
contents: n == null ? void 0 : n.schema.contents,
elementRef: e,
parent: (V = n == null ? void 0 : n.parent) == null ? void 0 : V.componentInstance,
schema: n == null ? void 0 : n.schema,
styles: v,
designerClass: i,
canAccepts: M,
getBelongedComponentInstance: m,
getDraggableDesignItemElement: w,
getDraggingDisplayText: d,
getPropConfig: a,
getDragScopeElement: f,
onAcceptMovedChildElement: h,
onChildElementMovedOut: y,
addNewChildComponentSchema: D,
triggerBelongedComponentToMoveWhenMoved: T(!1),
triggerBelongedComponentToDeleteWhenDeleted: T(!1),
onRemoveComponent: o,
getCustomButtons: g,
onPropertyChanged: b
}, l;
}
const Ie = /* @__PURE__ */ R({
name: "FCalendarDesign",
props: Q,
emits: [],
setup(e, n) {
const {
sameDay: u
} = q(), {
getToday: v
} = z(), i = T(e.firstDayOfTheWeek), l = T(e.events), r = v(), s = T({
year: r.year || 1,
month: r.month || 1,
day: r.day || 1
}), k = T(3), t = T(), m = le("design-item-context"), w = Fe(t, m);
J(() => {
t.value.componentInstance = w;
}), n.expose(w.value);
const {
getMonthlyCalendar: M,
getWeeklyCalendar: d,
getPreviousDay: f,
getNextDay: h,
getDayInPreviousWeek: D,
getDayInNextWeek: y,
getDayInPreviousMonth: a,
getDayInNextMonth: o
} = oe(), g = S(() => `${X[s.value.month || 1]} ${s.value.year}`), b = S(() => M(s.value.month || 1, s.value.year || 1, i.value)), V = S(() => d(s.value.day || 1, s.value.month || 1, s.value.year || 1, i.value)), p = S(() => V.value.days.find((C) => u(C.date, s.value)) || V.value.days[1]), P = S(() => {
const C = V.value.days.findIndex((ce) => u(ce.date, s.value)), se = C > -1 ? C : 1;
return F[se];
}), N = S(() => k.value === 3), O = S(() => k.value === 2), j = S(() => k.value === 1);
function W(C) {
k.value = C;
}
function H(C) {
C === 1 && (s.value = f(s.value)), C === 2 && (s.value = D(s.value)), C === 3 && (s.value = a(s.value));
}
function A(C) {
C === 1 && (s.value = h(s.value)), C === 2 && (s.value = y(s.value)), C === 3 && (s.value = o(s.value));
}
function I() {
s.value = {
year: r.year || 1,
month: r.month || 1,
day: r.day || 1
};
}
return () => c("div", {
ref: t,
class: "f-calendar"
}, [c(G, {
activeView: k.value,
title: g.value,
onViewChange: (C) => W(C),
onPrevious: (C) => H(C),
onNext: (C) => A(C),
onResetToToday: () => I()
}, null), c("div", null, [j.value && c(x, {
day: p.value,
dayInWeek: P.value,
events: l.value
}, null), O.value && c(Y, {
week: V.value,
events: l.value
}, null), N.value && c(L, {
activeDay: s.value,
dates: b.value,
events: l.value
}, null)])]);
}
});
E.install = (e) => {
e.component(E.name, E).component(x.name, x).component(G.name, G).component(L.name, L).component(Y.name, Y);
};
E.register = (e, n, u, v) => {
e.calendar = E, n.calendar = re;
};
E.registerDesigner = (e, n, u) => {
e.calendar = Ie, n.calendar = re;
};
export {
E as FCalendar,
x as FCalendarDayView,
G as FCalendarHeader,
L as FCalendarMonthView,
Y as FCalendarWeekView,
$ as MonthTag,
Q as calendarProps,
Re as dayViewProps,
E as default,
X as defaultNameOfMonths,
Ae as headerProps,
$e as monthViewProps,
re as propsResolver,
F as weekDays,
Ee as weekViewProps
};