@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
1,146 lines (1,145 loc) • 34.1 kB
JavaScript
import { defineComponent as F, ref as T, watch as $, computed as j, 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: f } = e, i = f && Array.isArray(f), l = Object.keys(n).reduce((r, s) => ((!i || !f.find((k) => k === s)) && (r[s] = n[s].type === "object" && n[s].properties ? U(n[s]) : K(n[s].default)), r), {});
if (u && (!i || !f.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: f } = e;
if (f && Array.isArray(f)) {
const i = f.reduce((l, r) => (l[r] = n[r].type === "object" && n[r].properties ? U(n[r]) : K(n[r].default), l), {});
if (u && f.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 f = ee[e];
if (f) {
let i = ue(f);
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((f, i) => (Object.prototype.hasOwnProperty.call(e, i) && (f[i] && Z(f[i]) && Z(e[i] || !e[i]) ? Object.assign(f[i], e[i] || {}) : f[i] = e[i]), f), u), u;
}
function ae(e, n) {
return Object.keys(e).filter((f) => e[f] != null).reduce((f, i) => {
if (n.has(i)) {
const l = n.get(i);
if (typeof l == "string")
f[l] = e[i];
else {
const r = l(i, e[i], e);
Object.assign(f, r);
}
} else
f[i] = e[i];
return f;
}, {});
}
function de(e, n, u = /* @__PURE__ */ new Map()) {
const f = ie(e, n);
return ae(f, u);
}
function ye(e = {}) {
function n(t, m, p, M) {
if (typeof p == "number")
return M[t].length === p;
if (typeof p == "object") {
const d = Object.keys(p)[0], v = p[d];
if (d === "not")
return Number(M[t].length) !== Number(v);
if (d === "moreThan")
return Number(M[t].length) >= Number(v);
if (d === "lessThan")
return Number(M[t].length) <= Number(v);
}
return !1;
}
function u(t, m, p, M) {
return M[t] && M[t].propertyValue && String(M[t].propertyValue.value) === String(p);
}
const f = /* @__PURE__ */ new Map([
["length", n],
["getProperty", u]
]);
Object.keys(e).reduce((t, m) => (t.set(m, e[m]), t), f);
function i(t, m) {
const p = t;
return typeof m == "number" ? [{ target: p, operator: "length", param: null, value: Number(m) }] : typeof m == "boolean" ? [{ target: p, operator: "getProperty", param: t, value: !!m }] : typeof m == "object" ? Object.keys(m).map((M) => {
if (M === "length")
return { target: p, operator: "length", param: null, value: m[M] };
const d = M, v = m[M];
return { target: p, operator: "getProperty", param: d, value: v };
}) : [];
}
function l(t) {
return Object.keys(t).reduce((p, M) => {
const d = i(M, t[M]);
return p.push(...d), p;
}, []);
}
function r(t, m) {
if (f.has(t.operator)) {
const p = f.get(t.operator);
return p && p(t.target, t.param, t.value, m) || !1;
}
return !1;
}
function s(t, m) {
return l(t).reduce((d, v) => d && r(v, m), !0);
}
function k(t, m) {
const p = Object.keys(t), M = p.includes("allOf"), d = p.includes("anyOf"), v = M || d, y = (v ? t[v ? M ? "allOf" : "anyOf" : "allOf"] : [t]).map((o) => s(o, m));
return M ? !y.includes(!1) : y.includes(!0);
}
return { parseValueSchema: k };
}
const fe = {}, ve = {};
ye();
function he(e, n, u = /* @__PURE__ */ new Map(), f = (r, s, k, t) => s, i = {}, l = (r) => r) {
return ee[n.title] = n, ne[n.title] = f, fe[n.title] = i, ve[n.title] = l, (r = {}, s = !0) => {
if (!s)
return ae(r, u);
const k = de(r, n, u), t = Object.keys(e).reduce((m, p) => (m[p] = e[p].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), I = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var E = /* @__PURE__ */ ((e) => (e[e.previous = 1] = "previous", e[e.current = 2] = "current", e[e.next = 3] = "next", e))(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 f(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 I.indexOf(t);
}
function l(t) {
return n(t).getTime();
}
function r(t) {
return Math.round(l(t) / 1e3);
}
function s(t, m, p) {
const M = l(m), d = l(p), v = l(t);
return d - v > v - M ? m : p;
}
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: f, 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 f(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: f, getPreviousMonth: i };
}
function oe() {
const { getToday: e, getDayNumber: n } = z(), { daysInMonth: u, daysInPreMonth: f, getNextMonth: i, getPreviousMonth: l } = je();
function r(h) {
const D = I.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, w = o ? f(y, a) : D - 1, b = o ? y - 1 : y, N = b < 1, O = N ? 12 : b;
return {
year: N ? a - 1 : a,
month: O,
day: w
};
}
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), w = D === o, b = w ? 1 : D + 1, N = w ? y + 1 : y, O = N > 12, g = O ? 1 : N;
return {
year: O ? a + 1 : a,
month: g,
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 p(h) {
const y = (h.day || 1) - 7, a = y < 1, o = a ? u(h.month || 1, h.year || 1) + y : y, w = a ? l(h.month || 1, h.year || 1) : h;
return {
day: o,
month: w.month,
year: w.year
};
}
function M(h) {
const y = (h.day || 1) + 7, a = u(h.month || 1, h.year || 1), o = y > a, w = o ? y - a : y, b = o ? i(h.month || 1, h.year || 1) : h;
return {
day: w,
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, N = n(o) + b, O = e();
let g = s(o);
const W = [];
for (let A = N - 1; A >= 1; A--) {
const q = g.month !== o.month ? E.previous : E.current, C = g.month === D && g.day === O.day && g.month === O.month && g.year === O.year;
W.push({ date: g, monthTag: q, isCurrent: C }), A > 1 && (g = s(g));
}
let V = k(o);
const S = [];
for (let A = N + 1; A <= 7; A++) {
const q = g.month !== o.month ? E.next : E.current, C = V.day === O.day && V.month === O.month && V.year === O.year;
S.push({ date: V, monthTag: q, isCurrent: C }), A < 7 && (V = k(V));
}
const P = h === O.day && D === O.month && y === O.year;
return {
days: [...W.reverse(), { date: o, monthTag: E.current, isCurrent: P }, ...S],
weekNumber: 0,
year: y
};
}
function v(h, D, y) {
const a = [], o = u(h, D);
for (let w = 1; w <= o; w += 7) {
const b = d(w, h, D, y);
a.push(b);
}
return a;
}
return {
getMonthlyCalendar: v,
getWeeklyCalendar: d,
getPreviousDay: s,
getNextDay: k,
getDayInPreviousWeek: p,
getDayInNextWeek: M,
getDayInPreviousMonth: t,
getDayInNextMonth: m
};
}
function _() {
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 f(d) {
return d && d.year !== 0;
}
function i(d, v) {
return e(d) < e(v);
}
function l(d, v) {
return e(d) <= e(v);
}
function r(d, v) {
return e(d) === e(v);
}
function s(d, v) {
const h = e(v);
return e(d.from) === h || e(d.to) === h;
}
function k(d, v) {
return !v || !n(v.to) || !n(v.from) ? !1 : l(v.from, d) && l(d, v.to);
}
function t(d, v) {
return n(v) && e(d) >= e(v);
}
function m(d, v) {
return n(v) && e(d) <= e(v);
}
function p(d, v) {
return e({ year: d.year, month: d.month, day: d.day }) === e({ year: v.year, month: v.month, day: v.day });
}
function M(d, v) {
return e({ hour: d.hour, minute: d.minute, second: d.second }) === e({ hour: v.hour, minute: v.minute, second: v.second });
}
return {
isDateEarlier: i,
equal: r,
inPeriod: k,
isPoint: s,
equalOrEarlier: l,
isInitializedDate: n,
isInitializedMonth: u,
isInitializedYear: f,
isMonthDisabledByDisableSince: t,
isMonthDisabledByDisableUntil: m,
sameTime: M,
sameDay: p
};
}
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" }
}, H = /* @__PURE__ */ F({
name: "FCalendarHeader",
props: Ae,
emits: ["ViewChange", "Previous", "Next", "ResetToToday"],
setup(e, n) {
const u = T(e.title), f = T(e.dailyViewTitle), i = T(e.weeklyViewTitle), l = T(e.monthlyViewTitle), r = 2, s = 62, k = T(e.activeView), t = T("Today");
$(() => e.title, () => {
u.value = e.title;
});
const m = j(() => ({
top: `${r}px`,
left: `${k.value * (r + 1) + (k.value - 1) * (s + 1)}px`
})), p = j(() => k.value === 1 ? f.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 v() {
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()
}, [f.value]), c("span", {
class: "f-calendar-view-switch-weekly",
onClick: (a) => d()
}, [i.value]), c("span", {
class: "f-calendar-view-switch-monthly",
onClick: (a) => v()
}, [l.value])]), c("div", {
class: "f-calendar-view-switch-active-view",
style: m.value
}, [p.value])])]);
}
}), Ee = {
dates: { Type: Array, default: [] },
daysInWeek: { Type: Array, default: I },
enableKeyboadNavigate: { Type: Boolean, default: !0 },
enableMarkCurrent: { Type: Boolean, default: !0 },
events: { Type: Array, default: [] },
activeDay: { Type: Object, default: null }
};
var G = /* @__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))(G || {});
function $e() {
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 x = /* @__PURE__ */ F({
name: "FCalendarMonthView",
props: Ee,
emits: ["click", "keyDown"],
setup(e, n) {
const u = T(e.daysInWeek), f = T(e.enableKeyboadNavigate), i = T(e.enableMarkCurrent), l = T(e.activeDay), r = T(e.events), {
equal: s,
sameDay: k
} = _(), {
getKeyCodeFromEvent: t
} = $e();
function m(y, a) {
return y.forEach((o) => {
o.days.forEach((w) => {
const b = a.filter((N) => k(N.starts, w.date));
b && b.length && (w.events = [...b]);
});
}), y;
}
const p = T(m(e.dates, r.value));
$(() => e.dates, () => {
p.value = m(e.dates, r.value);
}), $(() => e.activeDay, () => {
l.value = e.activeDay;
}), $(() => 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 === E.previous || y.monthTag === E.next
}, N = `d_${a}_${o}`;
return b[N] = !0, b;
}, v = (y) => {
const a = y.monthTag === E.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 !== G.tab && (y.preventDefault(), o === G.enter || o === G.space ? h(y, a) : f.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, [p.value && p.value.map((y, a) => c("tr", null, [y.days && y.days.map((o, w) => c("td", {
id: `d_${a}_${w}`,
tabindex: "0",
class: d(o, a, w),
onClick: (b) => h(b, o),
onKeydown: (b) => D(b, o)
}, [c("div", {
class: "f-calendar-month-view-title"
}, [c("div", {
class: v(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]))]))]))])])]);
}
}), Be = {
daysInWeek: { Type: Array, default: I },
enableMarkCurrent: { Type: Boolean, default: !0 },
events: { Type: Array, default: [] },
week: { Type: Object, default: { days: [], weekNumber: 0, year: 0 } }
}, L = /* @__PURE__ */ F({
name: "FCalendarWeekView",
props: Be,
emits: [],
setup(e) {
const n = T(), u = T(), f = T(e.daysInWeek), i = T(e.week), l = T(e.enableMarkCurrent), r = T(e.events), s = T([]), {
equal: k
} = _();
function t(a) {
return i.value.days.map((w) => {
const b = {
year: w.date.year,
month: w.date.month,
day: w.date.day,
hour: a.hour,
minute: a.minute,
second: a.second
}, N = r.value.filter((O) => k(O.starts, b));
return {
day: b,
events: N
};
});
}
function m() {
const a = [];
for (let o = 0; o < 24; o++) {
const w = {
hour: o,
minute: 0,
second: 0
}, b = {
hour: o,
minute: 30,
second: 0
}, N = t(w), O = t(b);
a.push({
time: w,
events: N,
title: o > 0 ? `${o}:00` : "",
part: "upper"
}), a.push({
time: b,
events: O,
title: `${o}:30`,
part: "lower"
});
}
s.value = a;
}
m(), $(() => e.week, () => {
i.value = e.week, m();
}), $(() => e.events, () => {
r.value = e.events, m();
});
const p = (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"
}, [f.value.map((a, o) => c("div", {
class: "f-calendar-week-view-header-cell"
}, [c("div", {
class: p(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 v(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 g = (a.starts.hour || 0) + (a.starts.minute || 0) / 60;
return {
height: `${44 * ((a.ends.hour || 0) + (a.ends.minute || 0) / 60 - g) - 2 - 2 - 1 - 1}px`
};
}
function D() {
return s.value.map((a) => c("div", {
class: v(a)
}, [a.events.map((o) => c("div", {
class: "f-calendar-week-view-item-cell"
}, [o.events.length > 0 && o.events.map((w) => c("div", {
class: "f-calendar-event",
style: h(w)
}, [w.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: [] }
}, Y = /* @__PURE__ */ F({
name: "FCalendarDayView",
props: Re,
emits: [],
setup(e) {
const n = T(), u = T(), f = T(e.dayInWeek), i = T(e.day), l = T(e.enableMarkCurrent), r = T(e.events), s = T([]), {
equal: k
} = _();
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
}, w = r.value.filter((b) => k(b.starts, o));
return [{
day: o,
events: w
}];
}
function m() {
const a = [];
for (let o = 0; o < 24; o++) {
const w = {
hour: o,
minute: 0,
second: 0
}, b = {
hour: o,
minute: 30,
second: 0
}, N = t(w), O = t(b);
a.push({
time: w,
events: N,
title: o > 0 ? `${o}:00` : "",
part: "upper"
}), a.push({
time: b,
events: O,
title: `${o}:30`,
part: "lower"
});
}
s.value = a;
}
m(), $(() => e.day, () => {
i.value = e.day, m();
}), $(() => e.events, () => {
r.value = e.events, m();
});
const p = (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: p(i.value)
}, [i.value.date.day]), c("span", null, [f.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 v(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 g = (a.starts.hour || 0) + (a.starts.minute || 0) / 60;
return {
height: `${44 * ((a.ends.hour || 0) + (a.ends.minute || 0) / 60 - g) - 2 - 2 - 1 - 1}px`
};
}
function D() {
return s.value.map((a) => c("div", {
class: v(a)
}, [a.events.map((o) => c("div", {
class: "f-calendar-day-view-item-cell"
}, [o.events.length > 0 && o.events.map((w) => c("div", {
class: "f-calendar-event",
style: h(w)
}, [w.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()])]);
}
}), R = /* @__PURE__ */ F({
name: "FCalendar",
props: Q,
emits: [],
setup(e) {
const {
sameDay: n
} = _(), {
getToday: u
} = z(), f = 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: p,
getDayInPreviousWeek: M,
getDayInNextWeek: d,
getDayInPreviousMonth: v,
getDayInNextMonth: h
} = oe(), D = j(() => `${X[r.value.month || 1]} ${r.value.year}`), y = j(() => k(r.value.month || 1, r.value.year || 1, f.value)), a = j(() => t(r.value.day || 1, r.value.month || 1, r.value.year || 1, f.value)), o = j(() => a.value.days.find((P) => n(P.date, r.value)) || a.value.days[1]), w = j(() => {
const P = a.value.days.findIndex((A) => n(A.date, r.value)), B = P > -1 ? P : 1;
return I[B];
}), b = j(() => s.value === 3), N = j(() => s.value === 2), O = j(() => s.value === 1);
function g(P) {
s.value = P;
}
function W(P) {
P === 1 && (r.value = m(r.value)), P === 2 && (r.value = M(r.value)), P === 3 && (r.value = v(r.value));
}
function V(P) {
P === 1 && (r.value = p(r.value)), P === 2 && (r.value = d(r.value)), P === 3 && (r.value = h(r.value));
}
function S() {
r.value = {
year: l.year || 1,
month: l.month || 1,
day: l.day || 1
};
}
return () => c("div", {
class: "f-calendar"
}, [c(H, {
activeView: s.value,
title: D.value,
onViewChange: (P) => g(P),
onPrevious: (P) => W(P),
onNext: (P) => V(P),
onResetToToday: () => S()
}, null), c("div", null, [O.value && c(Y, {
day: o.value,
dayInWeek: w.value,
events: i.value
}, null), N.value && c(L, {
week: a.value,
events: i.value
}, null), b.value && c(x, {
activeDay: r.value,
dates: y.value,
events: i.value
}, null)])]);
}
});
function Fe(e, n, u) {
var O;
const f = "", 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(g) {
if (!g || !g.value)
return null;
if (g.value.schema && g.value.schema.type === "component")
return g.value;
const W = T(g == null ? void 0 : g.value.parent), V = m(W);
return V || null;
}
function p(g = n) {
var P;
const { componentInstance: W, designerItemElementRef: V } = g;
if (!W || !W.value)
return null;
const { getCustomButtons: S } = W.value;
return W.value.canMove || S && ((P = S()) != null && P.length) ? V : p(g.parent);
}
function M(g) {
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 v() {
}
function h(g, W) {
var V;
!g || !W || (V = n == null ? void 0 : n.setupContext) == null || V.emit("dragEnd");
}
function D(g, W) {
const { componentType: V } = g;
let S = te(V, g, W);
const P = V.toLowerCase().replace(/-/g, "_");
return S && !S.id && S.type === V && (S.id = `${P}_${Math.random().toString().slice(2, 6)}`), S;
}
function y(g) {
}
function a(...g) {
}
function o(g) {
if (!g)
return;
const W = n == null ? void 0 : n.schema, { formSchemaUtils: V } = g;
if (W && V.getExpressions().length) {
const S = V.getExpressions().findIndex((P) => P.target === W.id);
S > -1 && V.getExpressions().splice(S, 1);
}
}
function w(g) {
o(g), n != null && n.schema.contents && n.schema.contents.map((W) => {
let V = W.id;
W.type === "component-ref" && (V = W.component);
const S = e.value.querySelectorAll(`#${V}-design-item`);
S != null && S.length && Array.from(S).map((P) => {
var B;
(B = P == null ? void 0 : P.componentInstance) != null && B.value.onRemoveComponent && P.componentInstance.value.onRemoveComponent(g);
});
});
}
function b() {
}
function N(g) {
}
return l.value = {
canMove: r(),
canSelectParent: s(),
canDelete: k(),
canNested: !t(),
contents: n == null ? void 0 : n.schema.contents,
elementRef: e,
parent: (O = n == null ? void 0 : n.parent) == null ? void 0 : O.componentInstance,
schema: n == null ? void 0 : n.schema,
styles: f,
designerClass: i,
canAccepts: M,
getBelongedComponentInstance: m,
getDraggableDesignItemElement: p,
getDraggingDisplayText: d,
getPropConfig: a,
getDragScopeElement: v,
onAcceptMovedChildElement: h,
onChildElementMovedOut: y,
addNewChildComponentSchema: D,
triggerBelongedComponentToMoveWhenMoved: T(!1),
triggerBelongedComponentToDeleteWhenDeleted: T(!1),
onRemoveComponent: w,
getCustomButtons: b,
onPropertyChanged: N
}, l;
}
const Ie = /* @__PURE__ */ F({
name: "FCalendarDesign",
props: Q,
emits: [],
setup(e, n) {
const {
sameDay: u
} = _(), {
getToday: f
} = z(), i = T(e.firstDayOfTheWeek), l = T(e.events), r = f(), s = T({
year: r.year || 1,
month: r.month || 1,
day: r.day || 1
}), k = T(3), t = T(), m = le("design-item-context"), p = Fe(t, m);
J(() => {
t.value.componentInstance = p;
}), n.expose(p.value);
const {
getMonthlyCalendar: M,
getWeeklyCalendar: d,
getPreviousDay: v,
getNextDay: h,
getDayInPreviousWeek: D,
getDayInNextWeek: y,
getDayInPreviousMonth: a,
getDayInNextMonth: o
} = oe(), w = j(() => `${X[s.value.month || 1]} ${s.value.year}`), b = j(() => M(s.value.month || 1, s.value.year || 1, i.value)), N = j(() => d(s.value.day || 1, s.value.month || 1, s.value.year || 1, i.value)), O = j(() => N.value.days.find((C) => u(C.date, s.value)) || N.value.days[1]), g = j(() => {
const C = N.value.days.findIndex((ce) => u(ce.date, s.value)), se = C > -1 ? C : 1;
return I[se];
}), W = j(() => k.value === 3), V = j(() => k.value === 2), S = j(() => k.value === 1);
function P(C) {
k.value = C;
}
function B(C) {
C === 1 && (s.value = v(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 q() {
s.value = {
year: r.year || 1,
month: r.month || 1,
day: r.day || 1
};
}
return () => c("div", {
ref: t,
class: "f-calendar"
}, [c(H, {
activeView: k.value,
title: w.value,
onViewChange: (C) => P(C),
onPrevious: (C) => B(C),
onNext: (C) => A(C),
onResetToToday: () => q()
}, null), c("div", null, [S.value && c(Y, {
day: O.value,
dayInWeek: g.value,
events: l.value
}, null), V.value && c(L, {
week: N.value,
events: l.value
}, null), W.value && c(x, {
activeDay: s.value,
dates: b.value,
events: l.value
}, null)])]);
}
});
R.install = (e) => {
e.component(R.name, R).component(Y.name, Y).component(H.name, H).component(x.name, x).component(L.name, L);
};
R.register = (e, n, u, f) => {
e.calendar = R, n.calendar = re;
};
R.registerDesigner = (e, n, u) => {
e.calendar = Ie, n.calendar = re;
};
export {
R as FCalendar,
Y as FCalendarDayView,
H as FCalendarHeader,
x as FCalendarMonthView,
L as FCalendarWeekView,
E as MonthTag,
Q as calendarProps,
Re as dayViewProps,
R as default,
X as defaultNameOfMonths,
Ae as headerProps,
Ee as monthViewProps,
re as propsResolver,
I as weekDays,
Be as weekViewProps
};