@shtabapp/ui-kit 1.85.0 → 1.85.2

package/dist/components/SCalendar/utils/calendar.types.js

@@ -0,0 +1,10 @@
+//#region src/components/SCalendar/utils/calendar.types.ts
+var EWorkTimeSource = /* @__PURE__ */ function(EWorkTimeSource) {
+	EWorkTimeSource["COMPUTER"] = "computer";
+	EWorkTimeSource["PHONE"] = "phone";
+	EWorkTimeSource["MANUAL"] = "manual";
+	EWorkTimeSource["IDLE"] = "idle";
+	return EWorkTimeSource;
+}({});
+//#endregion
+export { EWorkTimeSource };

package/dist/components/SCalendar/utils/formatDurationHM.cjs

@@ -0,0 +1,9 @@
+//#region src/components/SCalendar/utils/formatDurationHM.ts
+var formatDurationHM = (seconds) => {
+	const totalMinutes = Math.round(Math.max(0, seconds) / 60);
+	const hours = Math.floor(totalMinutes / 60);
+	const minutes = totalMinutes % 60;
+	return `${hours}:${String(minutes).padStart(2, "0")}`;
+};
+//#endregion
+exports.formatDurationHM = formatDurationHM;

package/dist/components/SCalendar/utils/formatDurationHM.js

@@ -0,0 +1,9 @@
+//#region src/components/SCalendar/utils/formatDurationHM.ts
+var formatDurationHM = (seconds) => {
+	const totalMinutes = Math.round(Math.max(0, seconds) / 60);
+	const hours = Math.floor(totalMinutes / 60);
+	const minutes = totalMinutes % 60;
+	return `${hours}:${String(minutes).padStart(2, "0")}`;
+};
+//#endregion
+export { formatDurationHM };

package/dist/components/SCalendarMonth/SCalendarMonth.types.cjs

@@ -0,0 +1,13 @@
+//#region src/components/SCalendarMonth/SCalendarMonth.types.ts
+var ESCalendarEventDirection = /* @__PURE__ */ function(ESCalendarEventDirection) {
+	ESCalendarEventDirection["IN"] = "in";
+	ESCalendarEventDirection["OUT"] = "out";
+	return ESCalendarEventDirection;
+}({});
+var ESCalendarMonthDayTone = /* @__PURE__ */ function(ESCalendarMonthDayTone) {
+	ESCalendarMonthDayTone["DANGER"] = "danger";
+	return ESCalendarMonthDayTone;
+}({});
+//#endregion
+exports.ESCalendarEventDirection = ESCalendarEventDirection;
+exports.ESCalendarMonthDayTone = ESCalendarMonthDayTone;

package/dist/components/SCalendarMonth/SCalendarMonth.types.js

@@ -0,0 +1,12 @@
+//#region src/components/SCalendarMonth/SCalendarMonth.types.ts
+var ESCalendarEventDirection = /* @__PURE__ */ function(ESCalendarEventDirection) {
+	ESCalendarEventDirection["IN"] = "in";
+	ESCalendarEventDirection["OUT"] = "out";
+	return ESCalendarEventDirection;
+}({});
+var ESCalendarMonthDayTone = /* @__PURE__ */ function(ESCalendarMonthDayTone) {
+	ESCalendarMonthDayTone["DANGER"] = "danger";
+	return ESCalendarMonthDayTone;
+}({});
+//#endregion
+export { ESCalendarEventDirection, ESCalendarMonthDayTone };

package/dist/components/SCalendarMonth/SCalendarMonth.vue.cjs

@@ -0,0 +1,6 @@
+const require_SCalendarMonth_vue_vue_type_script_setup_true_lang = require("./SCalendarMonth.vue_vue_type_script_setup_true_lang.cjs");
+;/* empty css                                                                    */
+//#region src/components/SCalendarMonth/SCalendarMonth.vue
+var SCalendarMonth_default = require_SCalendarMonth_vue_vue_type_script_setup_true_lang.default;
+//#endregion
+exports.default = SCalendarMonth_default;

package/dist/components/SCalendarMonth/SCalendarMonth.vue.js

@@ -0,0 +1,6 @@
+import SCalendarMonth_vue_vue_type_script_setup_true_lang_default from "./SCalendarMonth.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                  */
+//#region src/components/SCalendarMonth/SCalendarMonth.vue
+var SCalendarMonth_default = SCalendarMonth_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { SCalendarMonth_default as default };

package/dist/components/SCalendarMonth/SCalendarMonth.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,196 @@
+const require_formatDurationHM = require("../SCalendar/utils/formatDurationHM.cjs");
+let vue = require("vue");
+//#region src/components/SCalendarMonth/SCalendarMonth.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	class: "s-ui-calendar-month__header",
+	role: "row"
+};
+var _hoisted_2 = {
+	key: 0,
+	class: "s-ui-calendar-month__weekday s-ui-calendar-month__weekday--summary",
+	role: "columnheader"
+};
+var _hoisted_3 = {
+	key: 0,
+	class: "s-ui-calendar-month__day-number"
+};
+var _hoisted_4 = {
+	key: 0,
+	class: "s-ui-calendar-month__skeleton",
+	"aria-hidden": "true"
+};
+var _hoisted_5 = {
+	key: 0,
+	class: "s-ui-calendar-month__day-values"
+};
+var _hoisted_6 = {
+	key: 2,
+	class: "s-ui-calendar-month__events"
+};
+var _hoisted_7 = {
+	key: 0,
+	class: "s-ui-calendar-month__event-more"
+};
+var _hoisted_8 = {
+	key: 0,
+	class: "s-ui-calendar-month__day s-ui-calendar-month__day--summary",
+	role: "gridcell"
+};
+var _hoisted_9 = {
+	key: 0,
+	class: "s-ui-calendar-month__skeleton",
+	"aria-hidden": "true"
+};
+var _hoisted_10 = {
+	key: 1,
+	class: "s-ui-calendar-month__week-total"
+};
+var WEEKEND_START_INDEX = 5;
+var EMPTY_DAY_LABEL = "00:00";
+var SCalendarMonth_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "SCalendarMonth",
+	props: {
+		weeks: {},
+		weekdayLabels: {},
+		weekSummaryLabel: { default: "" },
+		hideWeekends: {
+			type: Boolean,
+			default: false
+		},
+		hideWeekSummary: {
+			type: Boolean,
+			default: false
+		},
+		hideEmpty: {
+			type: Boolean,
+			default: false
+		},
+		todayDate: { default: "" },
+		selectedDate: { default: "" },
+		showOtherMonthNumbers: {
+			type: Boolean,
+			default: false
+		},
+		maxVisibleEvents: {},
+		dayMinHeight: {},
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		interactive: {
+			type: Boolean,
+			default: false
+		},
+		formatDuration: { type: Function },
+		formatMoreEvents: { type: Function },
+		formatDayAriaLabel: { type: Function }
+	},
+	emits: ["dayClick"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const resolvedFormatDuration = (seconds) => (__props.formatDuration ?? require_formatDurationHM.formatDurationHM)(seconds);
+		const visibleWeekdayLabels = (0, vue.computed)(() => __props.hideWeekends ? __props.weekdayLabels.slice(0, WEEKEND_START_INDEX) : __props.weekdayLabels);
+		const rootClasses = (0, vue.computed)(() => ({
+			"s-ui-calendar-month--no-weekends": __props.hideWeekends,
+			"s-ui-calendar-month--no-summary": __props.hideWeekSummary,
+			"s-ui-calendar-month--loading": __props.loading
+		}));
+		const rootStyle = (0, vue.computed)(() => __props.dayMinHeight ? { "--s-ui-calendar-month-day-min-height": __props.dayMinHeight } : void 0);
+		const visibleDays = (week) => __props.hideWeekends ? week.days.slice(0, WEEKEND_START_INDEX) : week.days;
+		const workedSeconds = (day, field) => day[field] ?? 0;
+		const hasWorkTime = (day) => day.workedSeconds !== void 0 || day.overtimeSeconds !== void 0 || day.undertimeSeconds !== void 0;
+		const weekTotalSeconds = (week) => {
+			if (week.totalSeconds !== void 0) return week.totalSeconds;
+			return visibleDays(week).reduce((sum, day) => sum + (day.isOtherMonth ? 0 : workedSeconds(day, "workedSeconds")), 0);
+		};
+		const dayWorkedLabel = (day) => {
+			if (workedSeconds(day, "workedSeconds") > 0) return resolvedFormatDuration(workedSeconds(day, "workedSeconds"));
+			return __props.hideEmpty ? "" : EMPTY_DAY_LABEL;
+		};
+		const secondarySeconds = (day) => workedSeconds(day, "overtimeSeconds") > 0 ? workedSeconds(day, "overtimeSeconds") : workedSeconds(day, "undertimeSeconds");
+		const workedClass = (day) => workedSeconds(day, "workedSeconds") > 0 ? "s-ui-calendar-month__worked--filled" : "s-ui-calendar-month__worked--empty";
+		const showsDayNumber = (day) => !day.isOtherMonth || __props.showOtherMonthNumbers;
+		const isDayClickable = (day) => !day.disabled && (!day.isOtherMonth || __props.showOtherMonthNumbers);
+		const visibleEvents = (day) => {
+			const events = day.events ?? [];
+			return __props.maxVisibleEvents === void 0 ? events : events.slice(0, __props.maxVisibleEvents);
+		};
+		const hiddenEventCount = (day) => (day.events?.length ?? 0) - visibleEvents(day).length;
+		const moreEventsLabel = (day) => {
+			const hiddenCount = hiddenEventCount(day);
+			return __props.formatMoreEvents ? __props.formatMoreEvents(hiddenCount) : `+${hiddenCount}`;
+		};
+		const eventClass = (event) => event.direction ? `s-ui-calendar-month__event--${event.direction}` : void 0;
+		const dayClasses = (day) => ({
+			"s-ui-calendar-month__day--other": Boolean(day.isOtherMonth),
+			"s-ui-calendar-month__day--today": Boolean(__props.todayDate) && day.date === __props.todayDate,
+			"s-ui-calendar-month__day--selected": Boolean(__props.selectedDate) && day.date === __props.selectedDate,
+			"s-ui-calendar-month__day--disabled": Boolean(day.disabled),
+			"s-ui-calendar-month__day--events": (day.events?.length ?? 0) > 0,
+			[`s-ui-calendar-month__day--${day.tone}`]: Boolean(day.tone),
+			"s-ui-calendar-month__day--interactive": __props.interactive && isDayClickable(day)
+		});
+		const handleDayClick = (day) => {
+			if (!__props.interactive || __props.loading || !isDayClickable(day)) return;
+			emit("dayClick", day);
+		};
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+				class: (0, vue.normalizeClass)(["s-ui-calendar-month", rootClasses.value]),
+				style: (0, vue.normalizeStyle)(rootStyle.value),
+				role: "grid"
+			}, [(0, vue.createElementVNode)("div", _hoisted_1, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(visibleWeekdayLabels.value, (label) => {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
+					key: label,
+					class: "s-ui-calendar-month__weekday",
+					role: "columnheader"
+				}, (0, vue.toDisplayString)(label), 1);
+			}), 128)), !__props.hideWeekSummary ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_2, (0, vue.toDisplayString)(__props.weekSummaryLabel), 1)) : (0, vue.createCommentVNode)("", true)]), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.weeks, (week, weekIndex) => {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+					key: week.days[0]?.date ?? weekIndex,
+					class: "s-ui-calendar-month__week",
+					role: "row"
+				}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(visibleDays(week), (day) => {
+					return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.interactive ? "button" : "div"), {
+						key: day.date,
+						type: __props.interactive ? "button" : void 0,
+						disabled: __props.interactive && day.disabled ? true : void 0,
+						class: (0, vue.normalizeClass)(["s-ui-calendar-month__day", dayClasses(day)]),
+						role: "gridcell",
+						"aria-selected": __props.interactive ? day.date === __props.selectedDate : void 0,
+						"aria-label": __props.formatDayAriaLabel?.(day),
+						onClick: ($event) => handleDayClick(day)
+					}, {
+						default: (0, vue.withCtx)(() => [
+							showsDayNumber(day) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3, (0, vue.toDisplayString)(day.dayNumber), 1)) : (0, vue.createCommentVNode)("", true),
+							!day.isOtherMonth ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [__props.loading ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4)) : (0, vue.renderSlot)(_ctx.$slots, "day", {
+								key: 1,
+								day
+							}, () => [hasWorkTime(day) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_5, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(["s-ui-calendar-month__worked", workedClass(day)]) }, (0, vue.toDisplayString)(dayWorkedLabel(day)), 3), secondarySeconds(day) > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [_cache[0] || (_cache[0] = (0, vue.createElementVNode)("span", {
+								class: "s-ui-calendar-month__dot",
+								"aria-hidden": "true"
+							}, "•", -1)), (0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(["s-ui-calendar-month__delta", workedSeconds(day, "overtimeSeconds") > 0 ? "s-ui-calendar-month__delta--overtime" : "s-ui-calendar-month__delta--undertime"]) }, (0, vue.toDisplayString)(resolvedFormatDuration(secondarySeconds(day))), 3)], 64)) : (0, vue.createCommentVNode)("", true)])) : (0, vue.createCommentVNode)("", true)])], 64)) : (0, vue.createCommentVNode)("", true),
+							!__props.loading && visibleEvents(day).length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_6, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(visibleEvents(day), (event, eventIndex) => {
+								return (0, vue.renderSlot)(_ctx.$slots, "event", {
+									key: event.id ?? eventIndex,
+									event,
+									day
+								}, () => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(["s-ui-calendar-month__event", eventClass(event)]) }, (0, vue.toDisplayString)(event.label), 3)]);
+							}), 128)), hiddenEventCount(day) > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_7, (0, vue.toDisplayString)(moreEventsLabel(day)), 1)) : (0, vue.createCommentVNode)("", true)])) : (0, vue.createCommentVNode)("", true)
+						]),
+						_: 2
+					}, 1032, [
+						"type",
+						"disabled",
+						"class",
+						"aria-selected",
+						"aria-label",
+						"onClick"
+					]);
+				}), 128)), !__props.hideWeekSummary ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_8, [__props.loading ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_9)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_10, (0, vue.toDisplayString)(resolvedFormatDuration(weekTotalSeconds(week))), 1))])) : (0, vue.createCommentVNode)("", true)]);
+			}), 128))], 6);
+		};
+	}
+});
+//#endregion
+exports.default = SCalendarMonth_vue_vue_type_script_setup_true_lang_default;

package/dist/components/SCalendarMonth/SCalendarMonth.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,196 @@
+import { formatDurationHM } from "../SCalendar/utils/formatDurationHM.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, renderList, renderSlot, resolveDynamicComponent, toDisplayString, withCtx } from "vue";
+//#region src/components/SCalendarMonth/SCalendarMonth.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	class: "s-ui-calendar-month__header",
+	role: "row"
+};
+var _hoisted_2 = {
+	key: 0,
+	class: "s-ui-calendar-month__weekday s-ui-calendar-month__weekday--summary",
+	role: "columnheader"
+};
+var _hoisted_3 = {
+	key: 0,
+	class: "s-ui-calendar-month__day-number"
+};
+var _hoisted_4 = {
+	key: 0,
+	class: "s-ui-calendar-month__skeleton",
+	"aria-hidden": "true"
+};
+var _hoisted_5 = {
+	key: 0,
+	class: "s-ui-calendar-month__day-values"
+};
+var _hoisted_6 = {
+	key: 2,
+	class: "s-ui-calendar-month__events"
+};
+var _hoisted_7 = {
+	key: 0,
+	class: "s-ui-calendar-month__event-more"
+};
+var _hoisted_8 = {
+	key: 0,
+	class: "s-ui-calendar-month__day s-ui-calendar-month__day--summary",
+	role: "gridcell"
+};
+var _hoisted_9 = {
+	key: 0,
+	class: "s-ui-calendar-month__skeleton",
+	"aria-hidden": "true"
+};
+var _hoisted_10 = {
+	key: 1,
+	class: "s-ui-calendar-month__week-total"
+};
+var WEEKEND_START_INDEX = 5;
+var EMPTY_DAY_LABEL = "00:00";
+var SCalendarMonth_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "SCalendarMonth",
+	props: {
+		weeks: {},
+		weekdayLabels: {},
+		weekSummaryLabel: { default: "" },
+		hideWeekends: {
+			type: Boolean,
+			default: false
+		},
+		hideWeekSummary: {
+			type: Boolean,
+			default: false
+		},
+		hideEmpty: {
+			type: Boolean,
+			default: false
+		},
+		todayDate: { default: "" },
+		selectedDate: { default: "" },
+		showOtherMonthNumbers: {
+			type: Boolean,
+			default: false
+		},
+		maxVisibleEvents: {},
+		dayMinHeight: {},
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		interactive: {
+			type: Boolean,
+			default: false
+		},
+		formatDuration: { type: Function },
+		formatMoreEvents: { type: Function },
+		formatDayAriaLabel: { type: Function }
+	},
+	emits: ["dayClick"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const resolvedFormatDuration = (seconds) => (__props.formatDuration ?? formatDurationHM)(seconds);
+		const visibleWeekdayLabels = computed(() => __props.hideWeekends ? __props.weekdayLabels.slice(0, WEEKEND_START_INDEX) : __props.weekdayLabels);
+		const rootClasses = computed(() => ({
+			"s-ui-calendar-month--no-weekends": __props.hideWeekends,
+			"s-ui-calendar-month--no-summary": __props.hideWeekSummary,
+			"s-ui-calendar-month--loading": __props.loading
+		}));
+		const rootStyle = computed(() => __props.dayMinHeight ? { "--s-ui-calendar-month-day-min-height": __props.dayMinHeight } : void 0);
+		const visibleDays = (week) => __props.hideWeekends ? week.days.slice(0, WEEKEND_START_INDEX) : week.days;
+		const workedSeconds = (day, field) => day[field] ?? 0;
+		const hasWorkTime = (day) => day.workedSeconds !== void 0 || day.overtimeSeconds !== void 0 || day.undertimeSeconds !== void 0;
+		const weekTotalSeconds = (week) => {
+			if (week.totalSeconds !== void 0) return week.totalSeconds;
+			return visibleDays(week).reduce((sum, day) => sum + (day.isOtherMonth ? 0 : workedSeconds(day, "workedSeconds")), 0);
+		};
+		const dayWorkedLabel = (day) => {
+			if (workedSeconds(day, "workedSeconds") > 0) return resolvedFormatDuration(workedSeconds(day, "workedSeconds"));
+			return __props.hideEmpty ? "" : EMPTY_DAY_LABEL;
+		};
+		const secondarySeconds = (day) => workedSeconds(day, "overtimeSeconds") > 0 ? workedSeconds(day, "overtimeSeconds") : workedSeconds(day, "undertimeSeconds");
+		const workedClass = (day) => workedSeconds(day, "workedSeconds") > 0 ? "s-ui-calendar-month__worked--filled" : "s-ui-calendar-month__worked--empty";
+		const showsDayNumber = (day) => !day.isOtherMonth || __props.showOtherMonthNumbers;
+		const isDayClickable = (day) => !day.disabled && (!day.isOtherMonth || __props.showOtherMonthNumbers);
+		const visibleEvents = (day) => {
+			const events = day.events ?? [];
+			return __props.maxVisibleEvents === void 0 ? events : events.slice(0, __props.maxVisibleEvents);
+		};
+		const hiddenEventCount = (day) => (day.events?.length ?? 0) - visibleEvents(day).length;
+		const moreEventsLabel = (day) => {
+			const hiddenCount = hiddenEventCount(day);
+			return __props.formatMoreEvents ? __props.formatMoreEvents(hiddenCount) : `+${hiddenCount}`;
+		};
+		const eventClass = (event) => event.direction ? `s-ui-calendar-month__event--${event.direction}` : void 0;
+		const dayClasses = (day) => ({
+			"s-ui-calendar-month__day--other": Boolean(day.isOtherMonth),
+			"s-ui-calendar-month__day--today": Boolean(__props.todayDate) && day.date === __props.todayDate,
+			"s-ui-calendar-month__day--selected": Boolean(__props.selectedDate) && day.date === __props.selectedDate,
+			"s-ui-calendar-month__day--disabled": Boolean(day.disabled),
+			"s-ui-calendar-month__day--events": (day.events?.length ?? 0) > 0,
+			[`s-ui-calendar-month__day--${day.tone}`]: Boolean(day.tone),
+			"s-ui-calendar-month__day--interactive": __props.interactive && isDayClickable(day)
+		});
+		const handleDayClick = (day) => {
+			if (!__props.interactive || __props.loading || !isDayClickable(day)) return;
+			emit("dayClick", day);
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: normalizeClass(["s-ui-calendar-month", rootClasses.value]),
+				style: normalizeStyle(rootStyle.value),
+				role: "grid"
+			}, [createElementVNode("div", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleWeekdayLabels.value, (label) => {
+				return openBlock(), createElementBlock("span", {
+					key: label,
+					class: "s-ui-calendar-month__weekday",
+					role: "columnheader"
+				}, toDisplayString(label), 1);
+			}), 128)), !__props.hideWeekSummary ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.weekSummaryLabel), 1)) : createCommentVNode("", true)]), (openBlock(true), createElementBlock(Fragment, null, renderList(__props.weeks, (week, weekIndex) => {
+				return openBlock(), createElementBlock("div", {
+					key: week.days[0]?.date ?? weekIndex,
+					class: "s-ui-calendar-month__week",
+					role: "row"
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleDays(week), (day) => {
+					return openBlock(), createBlock(resolveDynamicComponent(__props.interactive ? "button" : "div"), {
+						key: day.date,
+						type: __props.interactive ? "button" : void 0,
+						disabled: __props.interactive && day.disabled ? true : void 0,
+						class: normalizeClass(["s-ui-calendar-month__day", dayClasses(day)]),
+						role: "gridcell",
+						"aria-selected": __props.interactive ? day.date === __props.selectedDate : void 0,
+						"aria-label": __props.formatDayAriaLabel?.(day),
+						onClick: ($event) => handleDayClick(day)
+					}, {
+						default: withCtx(() => [
+							showsDayNumber(day) ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(day.dayNumber), 1)) : createCommentVNode("", true),
+							!day.isOtherMonth ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [__props.loading ? (openBlock(), createElementBlock("span", _hoisted_4)) : renderSlot(_ctx.$slots, "day", {
+								key: 1,
+								day
+							}, () => [hasWorkTime(day) ? (openBlock(), createElementBlock("span", _hoisted_5, [createElementVNode("span", { class: normalizeClass(["s-ui-calendar-month__worked", workedClass(day)]) }, toDisplayString(dayWorkedLabel(day)), 3), secondarySeconds(day) > 0 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [_cache[0] || (_cache[0] = createElementVNode("span", {
+								class: "s-ui-calendar-month__dot",
+								"aria-hidden": "true"
+							}, "•", -1)), createElementVNode("span", { class: normalizeClass(["s-ui-calendar-month__delta", workedSeconds(day, "overtimeSeconds") > 0 ? "s-ui-calendar-month__delta--overtime" : "s-ui-calendar-month__delta--undertime"]) }, toDisplayString(resolvedFormatDuration(secondarySeconds(day))), 3)], 64)) : createCommentVNode("", true)])) : createCommentVNode("", true)])], 64)) : createCommentVNode("", true),
+							!__props.loading && visibleEvents(day).length ? (openBlock(), createElementBlock("span", _hoisted_6, [(openBlock(true), createElementBlock(Fragment, null, renderList(visibleEvents(day), (event, eventIndex) => {
+								return renderSlot(_ctx.$slots, "event", {
+									key: event.id ?? eventIndex,
+									event,
+									day
+								}, () => [createElementVNode("span", { class: normalizeClass(["s-ui-calendar-month__event", eventClass(event)]) }, toDisplayString(event.label), 3)]);
+							}), 128)), hiddenEventCount(day) > 0 ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(moreEventsLabel(day)), 1)) : createCommentVNode("", true)])) : createCommentVNode("", true)
+						]),
+						_: 2
+					}, 1032, [
+						"type",
+						"disabled",
+						"class",
+						"aria-selected",
+						"aria-label",
+						"onClick"
+					]);
+				}), 128)), !__props.hideWeekSummary ? (openBlock(), createElementBlock("div", _hoisted_8, [__props.loading ? (openBlock(), createElementBlock("span", _hoisted_9)) : (openBlock(), createElementBlock("span", _hoisted_10, toDisplayString(resolvedFormatDuration(weekTotalSeconds(week))), 1))])) : createCommentVNode("", true)]);
+			}), 128))], 6);
+		};
+	}
+});
+//#endregion
+export { SCalendarMonth_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/SCalendarWeekGrid/SCalendarWeekGrid.types.cjs

@@ -0,0 +1,4 @@
+//#region src/components/SCalendarWeekGrid/SCalendarWeekGrid.types.ts
+var CALENDAR_WEEK_SLOT_COUNT = 12;
+//#endregion
+exports.CALENDAR_WEEK_SLOT_COUNT = CALENDAR_WEEK_SLOT_COUNT;

package/dist/components/SCalendarWeekGrid/SCalendarWeekGrid.types.js

@@ -0,0 +1,4 @@
+//#region src/components/SCalendarWeekGrid/SCalendarWeekGrid.types.ts
+var CALENDAR_WEEK_SLOT_COUNT = 12;
+//#endregion
+export { CALENDAR_WEEK_SLOT_COUNT };

package/dist/components/SCalendarWeekGrid/SCalendarWeekGrid.vue.cjs

@@ -0,0 +1,6 @@
+const require_SCalendarWeekGrid_vue_vue_type_script_setup_true_lang = require("./SCalendarWeekGrid.vue_vue_type_script_setup_true_lang.cjs");
+;/* empty css                                                                       */
+//#region src/components/SCalendarWeekGrid/SCalendarWeekGrid.vue
+var SCalendarWeekGrid_default = require_SCalendarWeekGrid_vue_vue_type_script_setup_true_lang.default;
+//#endregion
+exports.default = SCalendarWeekGrid_default;

package/dist/components/SCalendarWeekGrid/SCalendarWeekGrid.vue.js

@@ -0,0 +1,6 @@
+import SCalendarWeekGrid_vue_vue_type_script_setup_true_lang_default from "./SCalendarWeekGrid.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                     */
+//#region src/components/SCalendarWeekGrid/SCalendarWeekGrid.vue
+var SCalendarWeekGrid_default = SCalendarWeekGrid_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { SCalendarWeekGrid_default as default };

package/dist/components/SCalendarWeekGrid/SCalendarWeekGrid.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,101 @@
+const require_calendar_const = require("../SCalendar/utils/calendar.const.cjs");
+require("./SCalendarWeekGrid.types.cjs");
+let vue = require("vue");
+//#region src/components/SCalendarWeekGrid/SCalendarWeekGrid.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	class: "s-ui-calendar-week-grid__header",
+	role: "row"
+};
+var _hoisted_2 = {
+	class: "s-ui-calendar-week-grid__slot-label",
+	role: "rowheader"
+};
+var SCalendarWeekGrid_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "SCalendarWeekGrid",
+	props: {
+		days: {},
+		slotLabels: {},
+		highlightedCategory: { default: null },
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		interactive: {
+			type: Boolean,
+			default: false
+		}
+	},
+	emits: ["cellClick"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const buildDefaultSlotLabels = () => Array.from({ length: 12 }, (_, index) => {
+			const startHour = index * 2;
+			const endHour = (startHour + 2) % 24;
+			const pad = (hour) => String(hour).padStart(2, "0");
+			return `${pad(startHour)}:00 - ${pad(endHour)}:00`;
+		});
+		const resolvedSlotLabels = (0, vue.computed)(() => __props.slotLabels ?? buildDefaultSlotLabels());
+		const rootClasses = (0, vue.computed)(() => ({
+			"s-ui-calendar-week-grid--loading": __props.loading,
+			"s-ui-calendar-week-grid--highlighting": __props.highlightedCategory !== null
+		}));
+		const rootStyle = (0, vue.computed)(() => ({ "--s-ui-calendar-week-grid-day-count": String(__props.days.length) }));
+		const cellClasses = (category) => ({
+			"s-ui-calendar-week-grid__cell--empty": category === null,
+			"s-ui-calendar-week-grid__cell--muted": __props.highlightedCategory !== null && category !== __props.highlightedCategory,
+			"s-ui-calendar-week-grid__cell--interactive": __props.interactive
+		});
+		const cellStyle = (category) => {
+			if (__props.loading || category === null) return;
+			return { backgroundColor: require_calendar_const.WORK_TIME_SOURCE_COLOR_VARS[category] };
+		};
+		const handleCellClick = (day, slotIndex) => {
+			if (!__props.interactive || __props.loading) return;
+			emit("cellClick", {
+				day,
+				slotIndex,
+				category: day.slots[slotIndex] ?? null
+			});
+		};
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+				class: (0, vue.normalizeClass)(["s-ui-calendar-week-grid", rootClasses.value]),
+				style: (0, vue.normalizeStyle)(rootStyle.value),
+				role: "grid"
+			}, [(0, vue.createElementVNode)("div", _hoisted_1, [_cache[0] || (_cache[0] = (0, vue.createElementVNode)("span", {
+				class: "s-ui-calendar-week-grid__corner",
+				"aria-hidden": "true"
+			}, null, -1)), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.days, (day) => {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
+					key: day.date,
+					class: "s-ui-calendar-week-grid__day-label",
+					role: "columnheader"
+				}, (0, vue.toDisplayString)(day.label), 1);
+			}), 128))]), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(resolvedSlotLabels.value, (slotLabel, slotIndex) => {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+					key: slotLabel,
+					class: "s-ui-calendar-week-grid__row",
+					role: "row"
+				}, [(0, vue.createElementVNode)("span", _hoisted_2, (0, vue.toDisplayString)(slotLabel), 1), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.days, (day) => {
+					return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.interactive ? "button" : "div"), {
+						key: day.date,
+						type: __props.interactive ? "button" : void 0,
+						"aria-label": __props.interactive ? `${day.label}, ${resolvedSlotLabels.value[slotIndex]}` : void 0,
+						class: (0, vue.normalizeClass)(["s-ui-calendar-week-grid__cell", cellClasses(day.slots[slotIndex] ?? null)]),
+						style: (0, vue.normalizeStyle)(cellStyle(day.slots[slotIndex] ?? null)),
+						role: "gridcell",
+						onClick: ($event) => handleCellClick(day, slotIndex)
+					}, null, 8, [
+						"type",
+						"aria-label",
+						"class",
+						"style",
+						"onClick"
+					]);
+				}), 128))]);
+			}), 128))], 6);
+		};
+	}
+});
+//#endregion
+exports.default = SCalendarWeekGrid_vue_vue_type_script_setup_true_lang_default;