npm - @wpwp/schedule-calendar - Versions diffs - 0.1.0 - Mend

@wpwp/schedule-calendar 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/vue-schedule-calendar.css +1 -0
package/dist/vue-schedule-calendar.js +617 -0
package/dist/vue-schedule-calendar.umd.cjs +1 -0
package/package.json +48 -0

package/dist/vue-schedule-calendar.css ADDED Viewed

@@ -0,0 +1 @@

+ .sc-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;gap:8px}.sc-header__left{display:flex;align-items:center;gap:8px}.sc-header__title{font-size:16px;font-weight:600;color:var(--sc-text, #333);min-width:120px;text-align:center}.sc-header__right{display:flex;align-items:center;gap:8px}.sc-header__tabs{display:flex;border:1px solid var(--sc-border, #ddd);border-radius:var(--sc-radius, 8px);overflow:hidden}.sc-header__tab{padding:4px 12px;font-size:13px;border:none;background:var(--sc-bg, #fff);color:var(--sc-text-secondary, #666);cursor:pointer;transition:all .15s}.sc-header__tab--active{background:var(--sc-primary, #4f6ef7);color:#fff}.sc-btn{border:none;cursor:pointer;border-radius:var(--sc-radius, 8px);font-size:13px;transition:all .15s;font-family:inherit}.sc-btn--icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--sc-bg, #fff);border:1px solid var(--sc-border, #ddd);color:var(--sc-text, #333)}.sc-btn--icon:hover{background:var(--sc-hover-bg, #f5f5f5)}.sc-btn--text{background:none;color:var(--sc-primary, #4f6ef7);padding:4px 8px}.sc-btn--text:hover{background:var(--sc-hover-bg, #f5f5f5)}.sc-btn--primary{background:var(--sc-primary, #4f6ef7);color:#fff;padding:4px 12px}.sc-btn--primary:hover{background:var(--sc-primary-hover, #3b5de7)}.sc-btn--primary:disabled{opacity:.5;cursor:not-allowed}.sc-btn--small{font-size:12px;padding:3px 10px}.sc-day-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 0;min-height:48px;cursor:pointer;border-radius:var(--sc-radius, 8px);transition:background-color .15s;position:relative}.sc-day-cell:hover{background-color:var(--sc-hover-bg, #f5f5f5)}.sc-day-cell--other-month .sc-day-cell__number{color:var(--sc-text-muted, #bbb)}.sc-day-cell--today .sc-day-cell__number{color:var(--sc-primary, #4f6ef7);font-weight:700}.sc-day-cell--selected{background-color:var(--sc-primary, #4f6ef7)}.sc-day-cell--selected .sc-day-cell__number{color:#fff!important}.sc-day-cell--selected:hover{background-color:var(--sc-primary-hover, #3b5de7)}.sc-day-cell__number{font-size:14px;line-height:1;color:var(--sc-text, #333)}.sc-day-cell__dots{display:flex;gap:3px;margin-top:4px}.sc-day-cell__dot{width:5px;height:5px;border-radius:50%}.sc-month-view{width:100%}.sc-month-view__weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;padding-bottom:8px;border-bottom:1px solid var(--sc-border, #eee);margin-bottom:4px}.sc-month-view__weekday{font-size:12px;color:var(--sc-text-secondary, #999);font-weight:500}.sc-month-view__row{display:grid;grid-template-columns:repeat(7,1fr)}.sc-week-view{width:100%}.sc-week-view__weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;padding-bottom:8px;border-bottom:1px solid var(--sc-border, #eee);margin-bottom:4px}.sc-week-view__weekday{font-size:12px;color:var(--sc-text-secondary, #999);font-weight:500}.sc-week-view__row{display:grid;grid-template-columns:repeat(7,1fr)}.sc-schedule-form{padding:12px 0;display:flex;flex-direction:column;gap:10px}.sc-schedule-form__field{display:flex;flex-direction:column;gap:4px;flex:1}.sc-schedule-form__field label{font-size:12px;color:var(--sc-text-secondary, #999)}.sc-schedule-form__row{display:flex;gap:12px}.sc-schedule-form__input,.sc-schedule-form__textarea{border:1px solid var(--sc-border, #ddd);border-radius:var(--sc-radius, 8px);padding:6px 10px;font-size:14px;color:var(--sc-text, #333);background:var(--sc-bg, #fff);outline:none;transition:border-color .15s;font-family:inherit}.sc-schedule-form__input:focus,.sc-schedule-form__textarea:focus{border-color:var(--sc-primary, #4f6ef7)}.sc-schedule-form__textarea{resize:vertical}.sc-schedule-form__actions{display:flex;justify-content:flex-end;gap:8px;padding-top:4px}.sc-schedule-panel{border-top:1px solid var(--sc-border, #eee);padding:12px 0 0;margin-top:8px}.sc-schedule-panel__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.sc-schedule-panel__date{font-size:14px;font-weight:600;color:var(--sc-text, #333)}.sc-schedule-panel__empty{text-align:center;padding:20px 0;color:var(--sc-text-muted, #bbb);font-size:13px}.sc-schedule-panel__list{display:flex;flex-direction:column;gap:8px}.sc-schedule-panel__item{display:flex;align-items:flex-start;gap:10px;padding:8px;border-radius:var(--sc-radius, 8px);background:var(--sc-item-bg, #f9f9fb);transition:background-color .15s}.sc-schedule-panel__item:hover{background:var(--sc-hover-bg, #f0f0f5)}.sc-schedule-panel__item-bar{width:3px;min-height:32px;border-radius:2px;flex-shrink:0}.sc-schedule-panel__item-content{flex:1;min-width:0}.sc-schedule-panel__item-title{font-size:14px;font-weight:500;color:var(--sc-text, #333)}.sc-schedule-panel__item-time,.sc-schedule-panel__item-desc{font-size:12px;color:var(--sc-text-secondary, #999);margin-top:2px}.sc-schedule-panel__item-delete{background:none;border:none;color:var(--sc-text-muted, #bbb);cursor:pointer;font-size:18px;line-height:1;padding:0 4px;transition:color .15s}.sc-schedule-panel__item-delete:hover{color:var(--sc-danger, #e74c3c)}.sc-calendar{--sc-primary: #4f6ef7;--sc-primary-hover: #3b5de7;--sc-bg: #fff;--sc-text: #333;--sc-text-secondary: #666;--sc-text-muted: #bbb;--sc-border: #eee;--sc-hover-bg: #f5f5f5;--sc-item-bg: #f9f9fb;--sc-radius: 8px;--sc-danger: #e74c3c;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--sc-bg);padding:16px;border-radius:12px;box-sizing:border-box;width:100%;max-width:400px}.sc-calendar *,.sc-calendar *:before,.sc-calendar *:after{box-sizing:border-box}

package/dist/vue-schedule-calendar.js ADDED Viewed

@@ -0,0 +1,617 @@
+import { ref as W, computed as w, defineComponent as N, openBlock as i, createElementBlock as u, createElementVNode as r, toDisplayString as h, normalizeClass as B, Fragment as T, renderList as C, normalizeStyle as Y, createCommentVNode as S, toRef as $, unref as p, createBlock as E, reactive as Q, withDirectives as O, vModelText as V, watch as J, createVNode as X } from "vue";
+function P(e) {
+  const n = e.getFullYear(), s = String(e.getMonth() + 1).padStart(2, "0"), l = String(e.getDate()).padStart(2, "0");
+  return `${n}-${s}-${l}`;
+}
+function Z(e) {
+  const [n, s, l] = e.split("-").map(Number);
+  return new Date(n, s - 1, l);
+}
+function ee(e, n) {
+  return e.getFullYear() === n.getFullYear() && e.getMonth() === n.getMonth() && e.getDate() === n.getDate();
+}
+function L(e) {
+  return ee(e, /* @__PURE__ */ new Date());
+}
+function U(e, n) {
+  const s = new Date(e);
+  return s.setDate(s.getDate() + n), s;
+}
+function te(e, n) {
+  return new Date(e, n, 1);
+}
+function G(e, n = 0) {
+  const s = new Date(e), a = (s.getDay() - n + 7) % 7;
+  return s.setDate(s.getDate() - a), s;
+}
+function ne(e, n, s = 0) {
+  const l = te(e, n), a = G(l, s), t = [];
+  for (let d = 0; d < 42; d++)
+    t.push(U(a, d));
+  return t;
+}
+function se(e, n = 0) {
+  const s = G(e, n), l = [];
+  for (let a = 0; a < 7; a++)
+    l.push(U(s, a));
+  return l;
+}
+const R = {
+  weekDays: ["日", "一", "二", "三", "四", "五", "六"],
+  weekDaysShort: ["日", "一", "二", "三", "四", "五", "六"],
+  months: [
+    "一月",
+    "二月",
+    "三月",
+    "四月",
+    "五月",
+    "六月",
+    "七月",
+    "八月",
+    "九月",
+    "十月",
+    "十一月",
+    "十二月"
+  ],
+  today: "今天",
+  month: "月",
+  week: "周",
+  noEvents: "暂无日程",
+  addEvent: "新建日程",
+  title: "标题",
+  date: "日期",
+  startTime: "开始时间",
+  endTime: "结束时间",
+  description: "描述",
+  cancel: "取消",
+  confirm: "确定",
+  delete: "删除"
+}, ae = {
+  weekDays: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
+  weekDaysShort: ["S", "M", "T", "W", "T", "F", "S"],
+  months: [
+    "January",
+    "February",
+    "March",
+    "April",
+    "May",
+    "June",
+    "July",
+    "August",
+    "September",
+    "October",
+    "November",
+    "December"
+  ],
+  today: "Today",
+  month: "Month",
+  week: "Week",
+  noEvents: "No events",
+  addEvent: "New Event",
+  title: "Title",
+  date: "Date",
+  startTime: "Start",
+  endTime: "End",
+  description: "Description",
+  cancel: "Cancel",
+  confirm: "OK",
+  delete: "Delete"
+}, le = {
+  "zh-CN": R,
+  "en-US": ae
+};
+function F(e) {
+  return le[e] || R;
+}
+function H(e, n = 0) {
+  const s = F(e).weekDays;
+  return n === 1 ? [...s.slice(1), s[0]] : s;
+}
+function oe(e, n = "month", s = "zh-CN", l = 0) {
+  const a = /* @__PURE__ */ new Date(), t = W(e ? /* @__PURE__ */ new Date(e + "T00:00:00") : a), d = W(n), m = W(P(e ? /* @__PURE__ */ new Date(e + "T00:00:00") : a)), o = w(() => t.value.getFullYear()), c = w(() => t.value.getMonth()), v = w(() => F(s)), D = w(() => {
+    const f = o.value, x = c.value;
+    return s === "zh-CN" ? `${f}年${x + 1}月` : `${v.value.months[x]} ${f}`;
+  });
+  function M() {
+    t.value = /* @__PURE__ */ new Date(), m.value = P(/* @__PURE__ */ new Date());
+  }
+  function y() {
+    if (d.value === "month") {
+      const f = new Date(t.value);
+      f.setMonth(f.getMonth() - 1), t.value = f;
+    } else
+      t.value = U(t.value, -7);
+  }
+  function g() {
+    if (d.value === "month") {
+      const f = new Date(t.value);
+      f.setMonth(f.getMonth() + 1), t.value = f;
+    } else
+      t.value = U(t.value, 7);
+  }
+  function _(f) {
+    m.value = f;
+  }
+  function b(f) {
+    d.value = f;
+  }
+  return {
+    currentDate: t,
+    viewMode: d,
+    selectedDate: m,
+    currentYear: o,
+    currentMonth: c,
+    headerTitle: D,
+    localeStrings: v,
+    goToday: M,
+    goPrev: y,
+    goNext: g,
+    selectDate: _,
+    setViewMode: b
+  };
+}
+function ce(e, n) {
+  return { selectedEvents: w(() => e.value.filter((l) => l.date === n.value).sort((l, a) => l.startTime ? a.startTime ? l.startTime.localeCompare(a.startTime) : -1 : 1)) };
+}
+const re = { class: "sc-header" }, de = { class: "sc-header__left" }, ie = { class: "sc-header__title" }, ue = { class: "sc-header__right" }, ve = { class: "sc-header__tabs" }, me = /* @__PURE__ */ N({
+  __name: "CalendarHeader",
+  props: {
+    title: {},
+    viewMode: {},
+    locale: {}
+  },
+  emits: ["prev", "next", "today", "view-change"],
+  setup(e) {
+    const n = e, s = w(() => F(n.locale));
+    return (l, a) => (i(), u("div", re, [
+      r("div", de, [
+        r("button", {
+          class: "sc-btn sc-btn--icon",
+          onClick: a[0] || (a[0] = (t) => l.$emit("prev"))
+        }, "<"),
+        r("span", ie, h(e.title), 1),
+        r("button", {
+          class: "sc-btn sc-btn--icon",
+          onClick: a[1] || (a[1] = (t) => l.$emit("next"))
+        }, ">")
+      ]),
+      r("div", ue, [
+        r("button", {
+          class: "sc-btn sc-btn--text",
+          onClick: a[2] || (a[2] = (t) => l.$emit("today"))
+        }, h(s.value.today), 1),
+        r("div", ve, [
+          r("button", {
+            class: B(["sc-header__tab", { "sc-header__tab--active": e.viewMode === "month" }]),
+            onClick: a[3] || (a[3] = (t) => l.$emit("view-change", "month"))
+          }, h(s.value.month), 3),
+          r("button", {
+            class: B(["sc-header__tab", { "sc-header__tab--active": e.viewMode === "week" }]),
+            onClick: a[4] || (a[4] = (t) => l.$emit("view-change", "week"))
+          }, h(s.value.week), 3)
+        ])
+      ])
+    ]));
+  }
+});
+function he(e, n, s, l, a, t = 0) {
+  const d = w(() => ne(e.value, n.value, t).map((c) => {
+    const v = P(c), D = l.value.filter((_) => _.date === v), M = a.value.filter((_) => _.date === v), y = /* @__PURE__ */ new Map();
+    for (const _ of M)
+      y.set(_.color, { color: _.color, label: _.label });
+    for (const _ of D) {
+      const b = _.color || "var(--sc-primary)";
+      y.has(b) || y.set(b, { color: b });
+    }
+    const g = Array.from(y.values()).slice(0, 3);
+    return {
+      date: c,
+      dateStr: v,
+      day: c.getDate(),
+      isCurrentMonth: c.getMonth() === n.value,
+      isToday: L(c),
+      isSelected: v === s.value,
+      dots: g,
+      events: D
+    };
+  })), m = w(() => {
+    const o = [];
+    for (let c = 0; c < d.value.length; c += 7)
+      o.push(d.value.slice(c, c + 7));
+    return o;
+  });
+  return { days: d, rows: m };
+}
+const ye = { class: "sc-day-cell__number" }, fe = {
+  key: 0,
+  class: "sc-day-cell__dots"
+}, ke = ["title"], K = /* @__PURE__ */ N({
+  __name: "DayCell",
+  props: {
+    day: {}
+  },
+  emits: ["click"],
+  setup(e) {
+    return (n, s) => (i(), u("div", {
+      class: B(["sc-day-cell", {
+        "sc-day-cell--other-month": !e.day.isCurrentMonth,
+        "sc-day-cell--today": e.day.isToday,
+        "sc-day-cell--selected": e.day.isSelected
+      }]),
+      onClick: s[0] || (s[0] = (l) => n.$emit("click", e.day.dateStr))
+    }, [
+      r("span", ye, h(e.day.day), 1),
+      e.day.dots.length ? (i(), u("div", fe, [
+        (i(!0), u(T, null, C(e.day.dots, (l, a) => (i(), u("span", {
+          key: a,
+          class: "sc-day-cell__dot",
+          style: Y({ backgroundColor: l.color }),
+          title: l.label
+        }, null, 12, ke))), 128))
+      ])) : S("", !0)
+    ], 2));
+  }
+}), we = { class: "sc-month-view" }, _e = { class: "sc-month-view__weekdays" }, De = /* @__PURE__ */ N({
+  __name: "MonthView",
+  props: {
+    year: {},
+    month: {},
+    selectedDate: {},
+    events: {},
+    dotMarkers: {},
+    locale: {},
+    weekStartsOn: {}
+  },
+  emits: ["date-click"],
+  setup(e) {
+    const n = e, { rows: s } = he(
+      $(n, "year"),
+      $(n, "month"),
+      $(n, "selectedDate"),
+      $(n, "events"),
+      $(n, "dotMarkers"),
+      n.weekStartsOn
+    ), l = w(
+      () => H(n.locale, n.weekStartsOn)
+    );
+    return (a, t) => (i(), u("div", we, [
+      r("div", _e, [
+        (i(!0), u(T, null, C(l.value, (d) => (i(), u("div", {
+          key: d,
+          class: "sc-month-view__weekday"
+        }, h(d), 1))), 128))
+      ]),
+      (i(!0), u(T, null, C(p(s), (d, m) => (i(), u("div", {
+        key: m,
+        class: "sc-month-view__row"
+      }, [
+        (i(!0), u(T, null, C(d, (o) => (i(), E(K, {
+          key: o.dateStr,
+          day: o,
+          onClick: t[0] || (t[0] = (c) => a.$emit("date-click", c))
+        }, null, 8, ["day"]))), 128))
+      ]))), 128))
+    ]));
+  }
+});
+function pe(e, n, s, l, a = 0) {
+  return { days: w(() => se(e.value, a).map((m) => {
+    const o = P(m), c = s.value.filter((y) => y.date === o), v = l.value.filter((y) => y.date === o), D = /* @__PURE__ */ new Map();
+    for (const y of v)
+      D.set(y.color, { color: y.color, label: y.label });
+    for (const y of c) {
+      const g = y.color || "var(--sc-primary)";
+      D.has(g) || D.set(g, { color: g });
+    }
+    const M = Array.from(D.values()).slice(0, 3);
+    return {
+      date: m,
+      dateStr: o,
+      day: m.getDate(),
+      isCurrentMonth: !0,
+      isToday: L(m),
+      isSelected: o === n.value,
+      dots: M,
+      events: c
+    };
+  })) };
+}
+const $e = { class: "sc-week-view" }, ge = { class: "sc-week-view__weekdays" }, Me = { class: "sc-week-view__row" }, be = /* @__PURE__ */ N({
+  __name: "WeekView",
+  props: {
+    currentDate: {},
+    selectedDate: {},
+    events: {},
+    dotMarkers: {},
+    locale: {},
+    weekStartsOn: {}
+  },
+  emits: ["date-click"],
+  setup(e) {
+    const n = e, { days: s } = pe(
+      $(n, "currentDate"),
+      $(n, "selectedDate"),
+      $(n, "events"),
+      $(n, "dotMarkers"),
+      n.weekStartsOn
+    ), l = w(
+      () => H(n.locale, n.weekStartsOn)
+    );
+    return (a, t) => (i(), u("div", $e, [
+      r("div", ge, [
+        (i(!0), u(T, null, C(l.value, (d) => (i(), u("div", {
+          key: d,
+          class: "sc-week-view__weekday"
+        }, h(d), 1))), 128))
+      ]),
+      r("div", Me, [
+        (i(!0), u(T, null, C(p(s), (d) => (i(), E(K, {
+          key: d.dateStr,
+          day: d,
+          onClick: t[0] || (t[0] = (m) => a.$emit("date-click", m))
+        }, null, 8, ["day"]))), 128))
+      ])
+    ]));
+  }
+}), Se = { class: "sc-schedule-form" }, Te = { class: "sc-schedule-form__field" }, Ce = { class: "sc-schedule-form__field" }, Ne = { class: "sc-schedule-form__row" }, Ee = { class: "sc-schedule-form__field" }, Oe = { class: "sc-schedule-form__field" }, Ve = { class: "sc-schedule-form__field" }, Fe = { class: "sc-schedule-form__actions" }, xe = ["disabled"], ze = /* @__PURE__ */ N({
+  __name: "ScheduleForm",
+  props: {
+    selectedDate: {},
+    locale: {}
+  },
+  emits: ["submit", "cancel"],
+  setup(e, { emit: n }) {
+    const s = e, l = n, a = w(() => F(s.locale)), t = Q({
+      title: "",
+      date: s.selectedDate,
+      startTime: "",
+      endTime: "",
+      description: ""
+    });
+    function d() {
+      t.title.trim() && (l("submit", {
+        title: t.title.trim(),
+        date: t.date,
+        startTime: t.startTime || void 0,
+        endTime: t.endTime || void 0,
+        description: t.description.trim() || void 0
+      }), t.title = "", t.startTime = "", t.endTime = "", t.description = "");
+    }
+    return (m, o) => (i(), u("div", Se, [
+      r("div", Te, [
+        r("label", null, h(a.value.title), 1),
+        O(r("input", {
+          "onUpdate:modelValue": o[0] || (o[0] = (c) => t.title = c),
+          type: "text",
+          class: "sc-schedule-form__input"
+        }, null, 512), [
+          [V, t.title]
+        ])
+      ]),
+      r("div", Ce, [
+        r("label", null, h(a.value.date), 1),
+        O(r("input", {
+          "onUpdate:modelValue": o[1] || (o[1] = (c) => t.date = c),
+          type: "date",
+          class: "sc-schedule-form__input"
+        }, null, 512), [
+          [V, t.date]
+        ])
+      ]),
+      r("div", Ne, [
+        r("div", Ee, [
+          r("label", null, h(a.value.startTime), 1),
+          O(r("input", {
+            "onUpdate:modelValue": o[2] || (o[2] = (c) => t.startTime = c),
+            type: "time",
+            class: "sc-schedule-form__input"
+          }, null, 512), [
+            [V, t.startTime]
+          ])
+        ]),
+        r("div", Oe, [
+          r("label", null, h(a.value.endTime), 1),
+          O(r("input", {
+            "onUpdate:modelValue": o[3] || (o[3] = (c) => t.endTime = c),
+            type: "time",
+            class: "sc-schedule-form__input"
+          }, null, 512), [
+            [V, t.endTime]
+          ])
+        ])
+      ]),
+      r("div", Ve, [
+        r("label", null, h(a.value.description), 1),
+        O(r("textarea", {
+          "onUpdate:modelValue": o[4] || (o[4] = (c) => t.description = c),
+          class: "sc-schedule-form__textarea",
+          rows: "2"
+        }, null, 512), [
+          [V, t.description]
+        ])
+      ]),
+      r("div", Fe, [
+        r("button", {
+          class: "sc-btn sc-btn--text",
+          onClick: o[5] || (o[5] = (c) => m.$emit("cancel"))
+        }, h(a.value.cancel), 1),
+        r("button", {
+          class: "sc-btn sc-btn--primary",
+          disabled: !t.title.trim(),
+          onClick: d
+        }, h(a.value.confirm), 9, xe)
+      ])
+    ]));
+  }
+}), We = { class: "sc-schedule-panel" }, Pe = { class: "sc-schedule-panel__header" }, Ue = { class: "sc-schedule-panel__date" }, Ae = {
+  key: 1,
+  class: "sc-schedule-panel__empty"
+}, Be = {
+  key: 2,
+  class: "sc-schedule-panel__list"
+}, Je = { class: "sc-schedule-panel__item-content" }, Ye = { class: "sc-schedule-panel__item-title" }, Le = {
+  key: 0,
+  class: "sc-schedule-panel__item-time"
+}, Ge = {
+  key: 1,
+  class: "sc-schedule-panel__item-desc"
+}, Re = ["title", "onClick"], He = /* @__PURE__ */ N({
+  __name: "SchedulePanel",
+  props: {
+    events: {},
+    selectedDate: {},
+    locale: {},
+    readonly: { type: Boolean }
+  },
+  emits: ["event-create", "event-delete"],
+  setup(e, { emit: n }) {
+    const s = e, l = n, a = W(!1), t = w(() => F(s.locale)), d = w(() => {
+      const o = Z(s.selectedDate);
+      return s.locale === "zh-CN" ? `${o.getMonth() + 1}月${o.getDate()}日` : `${["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"][o.getMonth()]} ${o.getDate()}`;
+    });
+    function m(o) {
+      l("event-create", o), a.value = !1;
+    }
+    return (o, c) => (i(), u("div", We, [
+      r("div", Pe, [
+        r("span", Ue, h(d.value), 1),
+        !e.readonly && !a.value ? (i(), u("button", {
+          key: 0,
+          class: "sc-btn sc-btn--small sc-btn--primary",
+          onClick: c[0] || (c[0] = (v) => a.value = !0)
+        }, h(t.value.addEvent), 1)) : S("", !0)
+      ]),
+      a.value ? (i(), E(ze, {
+        key: 0,
+        "selected-date": e.selectedDate,
+        locale: e.locale,
+        onSubmit: m,
+        onCancel: c[1] || (c[1] = (v) => a.value = !1)
+      }, null, 8, ["selected-date", "locale"])) : S("", !0),
+      e.events.length === 0 && !a.value ? (i(), u("div", Ae, h(t.value.noEvents), 1)) : (i(), u("div", Be, [
+        (i(!0), u(T, null, C(e.events, (v) => (i(), u("div", {
+          key: v.id,
+          class: "sc-schedule-panel__item"
+        }, [
+          r("div", {
+            class: "sc-schedule-panel__item-bar",
+            style: Y({ backgroundColor: v.color || "var(--sc-primary, #4f6ef7)" })
+          }, null, 4),
+          r("div", Je, [
+            r("div", Ye, h(v.title), 1),
+            v.startTime ? (i(), u("div", Le, h(v.startTime) + h(v.endTime ? " - " + v.endTime : ""), 1)) : S("", !0),
+            v.description ? (i(), u("div", Ge, h(v.description), 1)) : S("", !0)
+          ]),
+          e.readonly ? S("", !0) : (i(), u("button", {
+            key: 0,
+            class: "sc-schedule-panel__item-delete",
+            title: t.value.delete,
+            onClick: (D) => o.$emit("event-delete", v.id)
+          }, " × ", 8, Re))
+        ]))), 128))
+      ]))
+    ]));
+  }
+}), Ke = { class: "sc-calendar" }, je = /* @__PURE__ */ N({
+  __name: "ScheduleCalendar",
+  props: {
+    events: { default: () => [] },
+    dotMarkers: { default: () => [] },
+    viewMode: { default: "month" },
+    selectedDate: { default: void 0 },
+    locale: { default: "zh-CN" },
+    weekStartsOn: { default: 0 },
+    showSchedulePanel: { type: Boolean, default: !0 },
+    readonly: { type: Boolean, default: !1 }
+  },
+  emits: ["date-click", "event-create", "event-delete", "view-change", "month-change", "update:viewMode", "update:selectedDate"],
+  setup(e, { emit: n }) {
+    const s = e, l = n, {
+      currentDate: a,
+      viewMode: t,
+      selectedDate: d,
+      currentYear: m,
+      currentMonth: o,
+      headerTitle: c,
+      goToday: v,
+      goPrev: D,
+      goNext: M,
+      selectDate: y,
+      setViewMode: g
+    } = oe(s.selectedDate, s.viewMode, s.locale, s.weekStartsOn), _ = $(s, "events"), { selectedEvents: b } = ce(_, d);
+    J(
+      () => s.viewMode,
+      (k) => {
+        k !== t.value && (t.value = k);
+      }
+    ), J(
+      () => s.selectedDate,
+      (k) => {
+        k && k !== d.value && (d.value = k);
+      }
+    );
+    function f(k) {
+      y(k), l("update:selectedDate", k), l("date-click", k);
+    }
+    function x(k) {
+      g(k), l("update:viewMode", k), l("view-change", k);
+    }
+    function j() {
+      D(), l("month-change", { year: m.value, month: o.value + 1 });
+    }
+    function q() {
+      M(), l("month-change", { year: m.value, month: o.value + 1 });
+    }
+    function I() {
+      v(), l("update:selectedDate", d.value), l("month-change", { year: m.value, month: o.value + 1 });
+    }
+    return (k, z) => (i(), u("div", Ke, [
+      X(me, {
+        title: p(c),
+        "view-mode": p(t),
+        locale: e.locale,
+        onPrev: j,
+        onNext: q,
+        onToday: I,
+        onViewChange: x
+      }, null, 8, ["title", "view-mode", "locale"]),
+      p(t) === "month" ? (i(), E(De, {
+        key: 0,
+        year: p(m),
+        month: p(o),
+        "selected-date": p(d),
+        events: e.events,
+        "dot-markers": e.dotMarkers,
+        locale: e.locale,
+        "week-starts-on": e.weekStartsOn,
+        onDateClick: f
+      }, null, 8, ["year", "month", "selected-date", "events", "dot-markers", "locale", "week-starts-on"])) : (i(), E(be, {
+        key: 1,
+        "current-date": p(a),
+        "selected-date": p(d),
+        events: e.events,
+        "dot-markers": e.dotMarkers,
+        locale: e.locale,
+        "week-starts-on": e.weekStartsOn,
+        onDateClick: f
+      }, null, 8, ["current-date", "selected-date", "events", "dot-markers", "locale", "week-starts-on"])),
+      e.showSchedulePanel ? (i(), E(He, {
+        key: 2,
+        events: p(b),
+        "selected-date": p(d),
+        locale: e.locale,
+        readonly: e.readonly,
+        onEventCreate: z[0] || (z[0] = (A) => k.$emit("event-create", A)),
+        onEventDelete: z[1] || (z[1] = (A) => k.$emit("event-delete", A))
+      }, null, 8, ["events", "selected-date", "locale", "readonly"])) : S("", !0)
+    ]));
+  }
+}), Ie = {
+  install(e) {
+    e.component("ScheduleCalendar", je);
+  }
+};
+export {
+  je as ScheduleCalendar,
+  Ie as default
+};

package/dist/vue-schedule-calendar.umd.cjs ADDED Viewed

@@ -0,0 +1 @@

package/package.json ADDED Viewed

@@ -0,0 +1,48 @@
+{
+  "name": "@wpwp/schedule-calendar",
+  "version": "0.1.0",
+  "description": "A Vue 3 schedule calendar component with month/week views, dot markers, and event management",
+  "type": "module",
+  "main": "./dist/vue-schedule-calendar.umd.cjs",
+  "module": "./dist/vue-schedule-calendar.es.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/vue-schedule-calendar.es.js",
+      "require": "./dist/vue-schedule-calendar.umd.cjs"
+    },
+    "./style.css": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite serve dev",
+    "build": "vite build && vue-tsc --declaration --emitDeclarationOnly --outDir dist",
+    "preview": "vite preview"
+  },
+  "peerDependencies": {
+    "vue": "^3.3.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.2.1",
+    "typescript": "^5.7.0",
+    "vite": "^6.0.0",
+    "vue": "^3.5.0",
+    "vue-tsc": "^2.2.0"
+  },
+  "keywords": [
+    "vue",
+    "vue3",
+    "calendar",
+    "schedule",
+    "datepicker",
+    "component"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": ""
+  }
+}