@web-utils/form-ui 1.0.0-beta24 → 1.0.0-beta26

package/month-calendar/index.mjs

@@ -1,312 +0,0 @@
-import { t as e } from "../chunks/DJNXk_Cv.mjs";
-import { Fragment as t, createElementBlock as n, createElementVNode as r, normalizeClass as i, normalizeStyle as a, openBlock as o, renderList as s, toDisplayString as c, withModifiers as l } from "vue";
-import u from "dayjs";
-//#region src/components/material-year-calendar/MonthCalendar.vue
-var d = {
-	name: "MonthCalendar",
-	props: {
-		activeDates: {
-			type: Array,
-			default: () => []
-		},
-		month: {
-			type: [String, Number],
-			default: () => u().month() + 1
-		},
-		year: {
-			type: [String, Number],
-			default: () => u().year()
-		},
-		lang: {
-			type: String,
-			default: "en"
-		},
-		activeClass: {
-			type: String,
-			default: () => ""
-		},
-		prefixClass: {
-			type: String,
-			default: () => "calendar--active"
-		}
-	},
-	emits: ["toggleDate", "monthClickEvent"],
-	data() {
-		return {
-			showDays: [],
-			isMouseDown: !1
-		};
-	},
-	computed: {
-		weekTitleFontSizeAdjustLang() {
-			return {
-				tw: "16px",
-				en: "14px",
-				pt: "14px",
-				de: "14px",
-				es: "14px",
-				pl: "12px",
-				ru: "14px"
-			}[this.lang];
-		},
-		monthTitle() {
-			return {
-				tw: [
-					"一月",
-					"二月",
-					"三月",
-					"四月",
-					"五月",
-					"六月",
-					"七月",
-					"八月",
-					"九月",
-					"十月",
-					"十一月",
-					"十二月"
-				],
-				en: [
-					"January",
-					"February",
-					"March",
-					"April",
-					"May",
-					"June",
-					"July",
-					"August",
-					"September",
-					"October",
-					"November",
-					"December"
-				],
-				pt: [
-					"Janeiro",
-					"Fevereiro",
-					"Março",
-					"Abril",
-					"Maio",
-					"Junho",
-					"Julho",
-					"Agosto",
-					"Setembro",
-					"Outubro",
-					"Novembro",
-					"Dezembro"
-				],
-				de: [
-					"Januar",
-					"Februar",
-					"März",
-					"April",
-					"Mai",
-					"Juni",
-					"Juli",
-					"August",
-					"September",
-					"Oktober",
-					"November",
-					"Dezember"
-				],
-				es: [
-					"Enero",
-					"Febrero",
-					"Marzo",
-					"Abril",
-					"Mayo",
-					"Junio",
-					"Julio",
-					"Agosto",
-					"Septiembre",
-					"Octubre",
-					"Noviembre",
-					"Diciembre"
-				],
-				pl: [
-					"Styczeń",
-					"Luty",
-					"Marzec",
-					"Kwiecień",
-					"Maj",
-					"Czerwiec",
-					"Lipiec",
-					"Sierpień",
-					"Wrzesień",
-					"Październik",
-					"Listopad",
-					"Grudzień"
-				],
-				ru: [
-					"Январь",
-					"Февраль",
-					"Март",
-					"Апрель",
-					"Май",
-					"Июнь",
-					"Июль",
-					"Август",
-					"Сентябрь",
-					"Октябрь",
-					"Ноябрь",
-					"Декабрь"
-				]
-			}[this.lang][this.month - 1];
-		}
-	},
-	watch: {
-		year(e) {
-			this.initCalendar();
-		},
-		activeDates(e, t) {
-			this.initCalendar();
-		}
-	},
-	created() {
-		this.initCalendar();
-	},
-	methods: {
-		initCalendar() {
-			if (!this.year || !this.month) return [];
-			let e = u().set("date", 1).set("year", this.year).set("month", this.month - 1), t = e.startOf("month").day() - 1;
-			t < 0 && (t += 7);
-			let n = e.endOf("month").date(), r = t >= 5 ? 6 : 5, i = 0;
-			this.showDays = Array.from(Array(r * 7).keys()).map((e) => ({
-				value: t <= e ? i++ % n + 1 : "",
-				active: !1,
-				isOtherMonth: t > e || i > n
-			})), this.activeDates.forEach((e) => {
-				let n;
-				typeof e == "string" ? n = {
-					date: e,
-					className: this.activeClass
-				} : typeof e == "object" && (n = e);
-				let r = u(n.date);
-				if (r.year() !== this.year) return;
-				let i = r.date(), a = Math.floor(i / 7), o = i % 7 - 1 + t + 7 * a;
-				this.showDays[o].active = !0, this.showDays[o].className = n.className;
-			});
-		},
-		showDayTitle(e) {
-			return {
-				tw: [
-					"一",
-					"二",
-					"三",
-					"四",
-					"五",
-					"六",
-					"日"
-				],
-				en: [
-					"Mo",
-					"Tu",
-					"We",
-					"Th",
-					"Fr",
-					"Sa",
-					"Su"
-				],
-				pt: [
-					"2ª",
-					"3ª",
-					"4ª",
-					"5ª",
-					"6ª",
-					"Sa",
-					"Do"
-				],
-				de: [
-					"Mo",
-					"Di",
-					"Mi",
-					"Do",
-					"Fr",
-					"Sa",
-					"So"
-				],
-				es: [
-					"Lu",
-					"Ma",
-					"Mi",
-					"Ju",
-					"Vi",
-					"Sá",
-					"Do"
-				],
-				pl: [
-					"Pon",
-					"Wt",
-					"Śr",
-					"Czw",
-					"Pt",
-					"Sob",
-					"Nie"
-				],
-				ru: [
-					"Пн",
-					"Вт",
-					"Ср",
-					"Чт",
-					"Пт",
-					"Сб",
-					"Вс"
-				]
-			}[this.lang][e];
-		},
-		toggleDay(e) {
-			e.isOtherMonth || this.$emit("toggleDate", {
-				month: this.month,
-				date: e.value,
-				selected: !e.active,
-				className: this.activeClass
-			});
-		},
-		dragDay(e) {
-			this.isMouseDown && this.toggleDay(e);
-		},
-		mouseDown(e) {
-			this.toggleDay(e), this.isMouseDown = !0;
-		},
-		mouseUp() {
-			this.isMouseDown = !1;
-		},
-		classList(e) {
-			let t = {
-				"calendar__day--otherMonth": e.isOtherMonth,
-				[this.prefixClass]: e.active
-			};
-			return e.active && (t[e.className] = !0), t;
-		},
-		monthClickEvent(e) {
-			let t = {
-				monthTitle: this.monthTitle,
-				month: this.month,
-				year: e
-			};
-			this.$emit("monthClickEvent", t);
-		}
-	}
-}, f = { class: "c-wrapper" }, p = { class: "calendar__body" }, m = ["onMouseover", "onMousedown"];
-function h(e, u, d, h, g, _) {
-	return o(), n("div", f, [r("div", {
-		class: "calendar",
-		onMouseup: u[1] || (u[1] = (...e) => _.mouseUp && _.mouseUp(...e)),
-		onMouseleave: u[2] || (u[2] = l((...e) => _.mouseUp && _.mouseUp(...e), ["stop"]))
-	}, [r("div", {
-		class: "calendar__title",
-		onClick: u[0] || (u[0] = (e) => _.monthClickEvent(d.year))
-	}, c(_.monthTitle), 1), r("div", p, [(o(), n(t, null, s(7, (e, t) => r("div", {
-		key: `title${e}`,
-		class: "calendar__day day__weektitle",
-		style: a({ fontSize: _.weekTitleFontSizeAdjustLang })
-	}, c(_.showDayTitle(t)), 5)), 64)), (o(!0), n(t, null, s(g.showDays, (e, t) => (o(), n("div", {
-		key: `day${t}`,
-		class: "calendar__day"
-	}, [r("div", {
-		class: i(["day", _.classList(e)]),
-		onMouseover: (t) => _.dragDay(e),
-		onMousedown: (t) => _.mouseDown(e)
-	}, c(e.value), 43, m)]))), 128))])], 32)]);
-}
-var g = /* @__PURE__ */ e(d, [["render", h], ["__scopeId", "data-v-2a7f150d"]]);
-//#endregion
-export { g as default };

package/month-calendar/style.css

@@ -1 +0,0 @@
-.c-wrapper[data-v-2a7f150d]{padding:10px}.calendar[data-v-2a7f150d]{text-align:center;color:#353c46cc;background-color:#fff;border-radius:2px;min-width:0;min-height:295px;text-decoration:none;transition:transform .3s;position:relative;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.calendar[data-v-2a7f150d]:hover{z-index:2}@media (min-width:1024px){.calendar[data-v-2a7f150d]:hover{transform:scale(1.15);box-shadow:0 7px 21px #0000001a}}.calendar .calendar__title[data-v-2a7f150d]{cursor:pointer;border-bottom:1px solid #c4c4c44d;flex:100%;justify-content:center;align-items:center;height:50px;margin-bottom:12px;font-size:18px;font-weight:700;display:flex}.calendar .calendar__body[data-v-2a7f150d]{flex-wrap:wrap;place-content:flex-start;min-width:194px;padding:0 20px;display:flex}.calendar .calendar__day[data-v-2a7f150d]{color:#5db3d4;flex:14.28%;justify-content:center;align-items:center;height:31px;font-size:16px;display:flex}.calendar .day__weektitle[data-v-2a7f150d]{color:#353c46cc}.calendar .day[data-v-2a7f150d]{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:5px;justify-content:center;align-items:center;width:22px;height:22px;font-size:14px;display:flex;position:relative}.calendar .day[data-v-2a7f150d]:after{content:"";z-index:1;background-color:#0000;border-radius:50%;width:10px;height:10px;display:block;position:absolute;top:-5px;right:-5px}.calendar .day.calendar--active[data-v-2a7f150d]:after{background-image:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M0%200h24v24H0z'%20fill='none'/%3e%3cpath%20fill='%23FF6060'%20d='M12%202C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm5%2011H7v-2h10v2z'/%3e%3c/svg%3e");background-size:100% 100%}.calendar .day[data-v-2a7f150d]:not(.calendar__day--otherMonth):hover{background-color:#6666661a;border-radius:5px}.calendar .day.calendar--active[data-v-2a7f150d]{color:#bcbcbc;background-color:#ffbaba80}.calendar .day.calendar--active.info[data-v-2a7f150d]{color:#fff;background-color:#17a2b8cc}.calendar .day.calendar--active.info[data-v-2a7f150d]:after{background-image:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20fill='%2317a2b8'%20d='M0%200h24v24H0V0z'/%3e%3cpath%20fill='white'%20d='M11%207h2v2h-2zm0%204h2v6h-2zm1-9C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm0%2018c-4.41%200-8-3.59-8-8s3.59-8%208-8%208%203.59%208%208-3.59%208-8%208z'/%3e%3c/svg%3e");background-size:100% 100%}.calendar .day.calendar--active.warning[data-v-2a7f150d]{color:#fff;background-color:#ffc107b3}.calendar .day.calendar--active.warning[data-v-2a7f150d]:after{background-color:#eaeaea4d;background-image:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20fill='%23ffc107'%20d='M4.47%2021h15.06c1.54%200%202.5-1.67%201.73-3L13.73%204.99c-.77-1.33-2.69-1.33-3.46%200L2.74%2018c-.77%201.33.19%203%201.73%203zM12%2014c-.55%200-1-.45-1-1v-2c0-.55.45-1%201-1s1%20.45%201%201v2c0%20.55-.45%201-1%201zm1%204h-2v-2h2v2z'/%3e%3c/svg%3e");background-size:100% 100%}.calendar .calendar__day--otherMonth[data-v-2a7f150d]{color:#eaeaea;cursor:auto}