@dotss/tictoccroc 0.11.0 → 0.11.2

package/dist/shared/components/Carousel/Carousel.mjs

@@ -1,58 +1,59 @@
-import e from "./CarouselSlide/index.mjs";
-import { Children as t, cloneElement as n, isValidElement as r, useCallback as i, useEffect as a, useRef as o, useState as s } from "react";
-import { Flexbox as c } from "@dotss/ui";
-import l from "@dotss/ui/core/useTheme";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { getCarouselSwipeDelta as e } from "./Carousel.utils.mjs";
+import t from "./CarouselSlide/index.mjs";
+import { Children as n, cloneElement as r, isValidElement as i, useCallback as a, useEffect as o, useRef as s, useState as c } from "react";
+import { Flexbox as l } from "@dotss/ui";
+import u from "@dotss/ui/core/useTheme";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region shared/components/Carousel/Carousel.tsx
-var f = 5;
-function p({ children: p, spacing: m = 2, edgeSpacing: h = 4, rowCount: g = 2, step: _ = 1, renderPagination: v, ...y }) {
-	let { spacing: b } = l(), [x, S] = s(1), [C, w] = s(1), [T, E] = s(0), D = o(null), O = o(null), k = o(null), A = o(0), j = o(0), M = o(0), N = o(!1), P = o(!0), F = o(0), I = b.content(m), L = b.content(h), R = t.toArray(p).filter(r).filter((t) => t.type === e), z = R.length, B = (e, t) => {
-		A.current = e, j.current = t;
-	}, V = () => {
-		if (!O.current || !N.current) return;
-		let e = (k.current?.offsetWidth || 0) * .01, t = -M.current >= e && x + 1 <= C, n = -M.current <= -e && x - 1 >= 1, r = Math.abs(M.current) >= f;
-		N.current = !1, P.current = !r, M.current = 0;
-		let i = x;
-		t ? i = x + 1 : n && (i = x - 1), O.current.style.transition = "transform 0.2s", O.current.style.cursor = "grab", H(i);
-	}, H = i((e, t = 0) => {
-		if (!O.current) return;
-		S(e);
-		let n = e === 1, r = e === C, i = (D.current?.offsetWidth || 0) - L, a = (k.current?.children[0]?.clientWidth || 0) + I, o = (i - a * Math.floor(i / a) - I) / 2, s = a * (e - 1) - o;
-		n ? O.current.style.transform = `translate3d(${t}px, 0, 0)` : r ? O.current.style.transform = `translate3d(${-(s - o) + t}px, 0, 0)` : O.current.style.transform = `translate3d(${-s + t}px, 0, 0)`;
+var p = 5;
+function m({ children: m, spacing: h = 2, edgeSpacing: g = 4, rowCount: _ = 2, step: v = 1, renderPagination: y, ...b }) {
+	let { spacing: x } = u(), [S, C] = c(1), [w, T] = c(1), [E, D] = c(0), O = s(null), k = s(null), A = s(null), j = s(0), M = s(0), N = s(0), P = s(!1), F = s(!0), I = s(0), L = x.content(h), R = x.content(g), z = n.toArray(m).filter(i).filter((e) => e.type === t), B = z.length, V = (e, t) => {
+		j.current = e, M.current = t;
+	}, H = () => {
+		if (!k.current || !P.current) return;
+		let e = (A.current?.offsetWidth || 0) * .01, t = -N.current >= e && S + 1 <= w, n = -N.current <= -e && S - 1 >= 1, r = Math.abs(N.current) >= p;
+		P.current = !1, F.current = !r, N.current = 0;
+		let i = S;
+		t ? i = S + 1 : n && (i = S - 1), k.current.style.transition = "transform 0.2s", k.current.style.cursor = "grab", U(i);
+	}, U = a((e, t = 0) => {
+		if (!k.current) return;
+		C(e);
+		let n = e === 1, r = e === w, i = (O.current?.offsetWidth || 0) - R, a = (A.current?.children[0]?.clientWidth || 0) + L, o = (i - a * Math.floor(i / a) - L) / 2, s = a * (e - 1) - o;
+		n ? k.current.style.transform = `translate3d(${t}px, 0, 0)` : r ? k.current.style.transform = `translate3d(${-(s - o) + t}px, 0, 0)` : k.current.style.transform = `translate3d(${-s + t}px, 0, 0)`;
 	}, [
+		R,
 		L,
-		I,
-		C
-	]), U = (e) => B(e.touches[0].clientX, e.touches[0].clientY), W = (e) => {
-		N.current = !0, B(e.clientX, e.clientY);
-	}, G = (e) => {
-		O.current && (O.current.style.transition = "transform 0.2s", O.current.style.cursor = "grab", H(e));
-	}, K = (e) => (t) => {
+		w
+	]), W = (e) => V(e.touches[0].clientX, e.touches[0].clientY), G = (e) => {
+		P.current = !0, V(e.clientX, e.clientY);
+	}, K = (e) => {
+		k.current && (k.current.style.transition = "transform 0.2s", k.current.style.cursor = "grab", U(e));
+	}, q = (e) => (t) => {
 		t.stopPropagation();
-		let n = Array.from(k.current?.children || []).indexOf(t.currentTarget), r = (D.current?.offsetWidth || 0) - L * 2, i = (k.current?.children[0]?.clientWidth || 0) + I, a = Math.floor(r / (i / _)) * g, o = (x - 1) * a, s = o + a - 1, c = k.current?.children.length || 0, l = n % g, u = Math.floor(n / g), d = n;
+		let n = Array.from(A.current?.children || []).indexOf(t.currentTarget), r = (O.current?.offsetWidth || 0) - R * 2, i = (A.current?.children[0]?.clientWidth || 0) + L, a = Math.floor(r / (i / v)) * _, o = (S - 1) * a, s = o + a - 1, c = A.current?.children.length || 0, l = n % _, u = Math.floor(n / _), d = n;
 		switch (t.key) {
 			case "ArrowRight": {
 				t.preventDefault();
-				let e = (u + 1) * g + l;
+				let e = (u + 1) * _ + l;
 				e < c && (d = e);
 				break;
 			}
 			case "ArrowLeft": {
 				t.preventDefault();
-				let e = (u - 1) * g + l;
+				let e = (u - 1) * _ + l;
 				e >= 0 && (d = e);
 				break;
 			}
 			case "ArrowDown": {
 				t.preventDefault();
 				let e = n + 1;
-				e < c && e % g > l && (d = e);
+				e < c && e % _ > l && (d = e);
 				break;
 			}
 			case "ArrowUp": {
 				t.preventDefault();
 				let e = n - 1;
-				e >= 0 && e % g < l && (d = e);
+				e >= 0 && e % _ < l && (d = e);
 				break;
 			}
 			case "Enter":
@@ -62,124 +63,129 @@ function p({ children: p, spacing: m = 2, edgeSpacing: h = 4, rowCount: g = 2, s
 			default: return;
 		}
 		if (d >= o && d <= s) {
-			(k.current?.children[d])?.focus();
+			(A.current?.children[d])?.focus();
 			return;
 		}
-		d >= 0 && d < c && (F.current = requestAnimationFrame(() => {
-			(k.current?.children[d])?.focus();
+		d >= 0 && d < c && (I.current = requestAnimationFrame(() => {
+			(A.current?.children[d])?.focus();
 		})), e?.(t);
-	}, q = (e) => {
-		e.propertyName === "transform" && (P.current = !0);
-	}, J = (e) => (t) => {
-		E(Number(t.currentTarget.getAttribute("aria-posinset")) - 1), e?.(t);
+	}, J = (e) => {
+		e.propertyName === "transform" && (F.current = !0);
+	}, Y = (e) => (t) => {
+		D(Number(t.currentTarget.getAttribute("aria-posinset")) - 1), e?.(t);
 	};
-	return a(() => {
-		let e = () => H(x);
+	return o(() => {
+		let e = () => U(S);
 		return e(), window.addEventListener("resize", e), () => {
 			window.removeEventListener("resize", e);
 		};
-	}, [H, x]), a(() => {
+	}, [U, S]), o(() => {
 		let e = () => {
-			let e = (D.current?.offsetWidth || 0) - L * 2, t = (k.current?.children[0]?.clientWidth || 0) + I, n = Math.floor(e / (t / _)), r = Math.ceil(z / (g || 1)), i = Math.max(r - (n - 1), 1);
-			S((e) => e > i ? i : e), w(i);
+			let e = (O.current?.offsetWidth || 0) - R * 2, t = (A.current?.children[0]?.clientWidth || 0) + L, n = Math.floor(e / (t / v)), r = Math.ceil(B / (_ || 1)), i = Math.max(r - (n - 1), 1);
+			C((e) => e > i ? i : e), T(i);
 		};
 		return e(), window.addEventListener("resize", e), () => {
 			window.removeEventListener("resize", e);
 		};
 	}, [
+		R,
 		L,
-		I,
-		z,
+		B,
+		v,
 		_,
-		g,
-		p
-	]), a(() => {
-		let e = O.current, t = (t, n, r) => {
-			if (!e || C <= 1) return;
-			e.style.transition = "none", e.style.cursor = "grabbing", M.current = t - A.current;
-			let i = n - j.current;
-			N.current = N.current || Math.abs(M.current) > 5 && Math.abs(i) < 10, N.current && (r.cancelable && (r.stopPropagation(), r.preventDefault()), e.style.transition = "none", e.style.cursor = "grabbing", H(x, M.current));
-		}, n = (e) => t(e.touches[0].clientX, e.touches[0].clientY, e), r = (e) => {
-			N.current && t(e.clientX, e.clientY, e);
+		m
+	]), o(() => {
+		let t = k.current, n = (n, r, i) => {
+			if (!t || w <= 1) return;
+			t.style.transition = "none", t.style.cursor = "grabbing", N.current = n - j.current;
+			let a = r - M.current;
+			P.current = P.current || Math.abs(N.current) > 5 && Math.abs(a) < 10, P.current && (i.cancelable && (i.stopPropagation(), i.preventDefault()), t.style.transition = "none", t.style.cursor = "grabbing", U(S, e({
+				fingerDeltaX: N.current,
+				page: S,
+				totalPages: w,
+				width: O.current?.offsetWidth ?? 0
+			})));
+		}, r = (e) => n(e.touches[0].clientX, e.touches[0].clientY, e), i = (e) => {
+			P.current && n(e.clientX, e.clientY, e);
 		};
-		return e && (e.addEventListener("mousemove", r), e.addEventListener("touchmove", n)), () => {
-			e && (e.removeEventListener("mousemove", r), e.removeEventListener("touchmove", n));
+		return t && (t.addEventListener("mousemove", i), t.addEventListener("touchmove", r)), () => {
+			t && (t.removeEventListener("mousemove", i), t.removeEventListener("touchmove", r));
 		};
 	}, [
-		H,
-		x,
-		C
-	]), a(() => () => {
-		F.current && cancelAnimationFrame(F.current);
-	}, []), a(() => {
-		let e = k.current, t = (e) => {
-			P.current || (e.stopPropagation(), e.preventDefault());
+		U,
+		S,
+		w
+	]), o(() => () => {
+		I.current && cancelAnimationFrame(I.current);
+	}, []), o(() => {
+		let e = A.current, t = (e) => {
+			F.current || (e.stopPropagation(), e.preventDefault());
 		};
 		return e?.addEventListener("click", t), () => {
 			e?.removeEventListener("click", t);
 		};
-	}, []), /* @__PURE__ */ d(c, {
+	}, []), /* @__PURE__ */ f(l, {
 		flexDirection: "column",
 		role: "list",
 		"aria-roledescription": "carousel",
 		"aria-label": "슬라이더",
 		flexGrow: 1,
-		...y,
+		...b,
 		inlineCSS: {
 			width: "100%",
-			...y?.inlineCSS
+			...b?.inlineCSS
 		},
-		children: [/* @__PURE__ */ u(c, {
-			ref: D,
+		children: [/* @__PURE__ */ d(l, {
+			ref: O,
 			inlineCSS: { overflow: "hidden" },
-			children: /* @__PURE__ */ u(c, {
-				ref: O,
-				onMouseDown: W,
-				onMouseUp: V,
-				onMouseLeave: V,
-				onTouchStart: U,
-				onTouchEnd: V,
-				onTouchCancel: V,
-				onTransitionEnd: q,
+			children: /* @__PURE__ */ d(l, {
+				ref: k,
+				onMouseDown: G,
+				onMouseUp: H,
+				onMouseLeave: H,
+				onTouchStart: W,
+				onTouchEnd: H,
+				onTouchCancel: H,
+				onTransitionEnd: J,
 				inlineCSS: {
-					gap: I,
-					paddingLeft: L,
-					paddingRight: L,
+					gap: L,
+					paddingLeft: R,
+					paddingRight: R,
 					transition: "transform 0.2s",
 					transform: "translate3d(0, 0, 0)",
 					cursor: "grab"
 				},
-				children: /* @__PURE__ */ u(c, {
-					ref: k,
+				children: /* @__PURE__ */ d(l, {
+					ref: A,
 					inlineCSS: {
-						gap: I,
+						gap: L,
 						display: "grid",
 						gridTemplateRows: "min-content",
 						transform: "translate3d(0, 0, 0)"
 					},
-					children: t.map(R, (e, t) => n(e, {
+					children: n.map(z, (e, t) => r(e, {
 						role: "listitem",
-						tabIndex: t === T ? 0 : -1,
+						tabIndex: t === E ? 0 : -1,
 						"aria-roledescription": "slide",
-						"aria-label": `${z}개 중 ${t + 1}번째 슬라이드`,
+						"aria-label": `${B}개 중 ${t + 1}번째 슬라이드`,
 						"aria-posinset": t + 1,
-						"aria-setsize": z,
-						onKeyDown: K(e.props.onKeyDown),
-						onFocus: J(e.props.onFocus),
+						"aria-setsize": B,
+						onKeyDown: q(e.props.onKeyDown),
+						onFocus: Y(e.props.onFocus),
 						...e.props,
 						style: {
 							...e.props?.style,
-							gridRow: `${t % g + 1} / ${t % g + 1}`
+							gridRow: `${t % _ + 1} / ${t % _ + 1}`
 						}
 					}))
 				})
 			})
-		}), typeof v == "function" && v({
-			page: x,
-			totalPages: C,
-			onChange: G
+		}), typeof y == "function" && y({
+			page: S,
+			totalPages: w,
+			onChange: K
 		})]
 	});
 }
 //#endregion
-export { p as default };
+export { m as default };

package/dist/shared/components/Carousel/Carousel.utils.d.ts

@@ -0,0 +1,8 @@
+export declare const EDGE_RESISTANCE = 0.55;
+export declare function addDamping(distance: number, maxDistance: number, constant?: number): number;
+export declare function getCarouselSwipeDelta({ fingerDeltaX, page, totalPages, width }: {
+    fingerDeltaX: number;
+    page: number;
+    totalPages: number;
+    width: number;
+}): number;

package/dist/shared/components/Carousel/Carousel.utils.mjs

@@ -0,0 +1,12 @@
+//#region shared/components/Carousel/Carousel.utils.tsx
+var e = .55;
+function t(t, n, r = e) {
+	if (t === 0 || n <= 0) return 0;
+	let i = Math.abs(t), a = i * n * r / (n + r * i);
+	return Math.sign(t) * a;
+}
+function n({ fingerDeltaX: e, page: n, totalPages: r, width: i }) {
+	return !(n === 1 && e > 0) && !(n === r && e < 0) ? e : t(e, i);
+}
+//#endregion
+export { e as EDGE_RESISTANCE, t as addDamping, n as getCarouselSwipeDelta };

package/dist/shared/components/Carousel/Carousel.utils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/shared/components/ChatKit/BotMessage/BotMessage.d.ts

@@ -1,6 +1,6 @@
 import { FlexboxProps } from 'node_modules/@dotss/ui/Flexbox/Flexbox';
-export type BotMessageType = 'TEACHER_INQUIRED' | 'PARENT_CHANGED_OFFER_SCHEDULE' | 'PARENT_CHANGED_MATCHING_SCHEDULE' | 'TEACHER_APPLIED' | 'PARENT_SENT_OFFER' | 'KOK_MATCHING_SUCCEEDED' | 'APPLICATION_MATCHING_SUCCEEDED' | 'ASSIGNMENT_MATCHING_SUCCEEDED' | 'PARENT_REJECTED_APPLICATION' | 'TEACHER_REFUSED_OFFER' | 'PARENT_CANCELED_MATCHING' | 'TEACHER_CANCELED_MATCHING' | 'TEACHER_COMPLETED_CARE' | 'ADMIN_CANCELED_MATCHING' | 'AUTO_MATCHING_SUCCEEDED' | 'PLAY_CONTENT_RECOMMENDED' | 'PARENT_REQUESTED_MATCHING_SCHEDULE_CHANGE' | 'TEACHER_ACCEPTED_MATCHING_SCHEDULE_CHANGE' | 'TEACHER_REFUSED_MATCHING_SCHEDULE_CHANGE' | 'MATCHING_SCHEDULE_CHANGE_EXPIRED' | 'ADMIN_CANCELED_OFFER' | 'TEACHER_BECAME_ROOKIE';
-export type BotMessageCtaType = 'MY_CLASS_CHECK' | 'OFFER_CHECK' | 'CHANGE_INFO_CHECK' | 'MY_APPLICATION_INFO_VIEW' | 'CARE_NOTE_CHECK' | 'TEACHER_SELECTION' | 'PLAY_CONTENT_EXPLORE' | 'ACTIVITY_GUIDEBOOK_VIEW';
+export type BotMessageType = 'TEACHER_INQUIRED' | 'PARENT_CHANGED_OFFER_SCHEDULE' | 'PARENT_CHANGED_MATCHING_SCHEDULE' | 'TEACHER_APPLIED' | 'PARENT_SENT_OFFER' | 'KOK_MATCHING_SUCCEEDED' | 'APPLICATION_MATCHING_SUCCEEDED' | 'ASSIGNMENT_MATCHING_SUCCEEDED' | 'PARENT_REJECTED_APPLICATION' | 'TEACHER_REFUSED_OFFER' | 'PARENT_CANCELED_MATCHING' | 'TEACHER_CANCELED_MATCHING' | 'TEACHER_COMPLETED_CARE' | 'ADMIN_CANCELED_MATCHING' | 'AUTO_MATCHING_SUCCEEDED' | 'PLAY_CONTENT_RECOMMENDED' | 'PARENT_REQUESTED_MATCHING_SCHEDULE_CHANGE' | 'TEACHER_ACCEPTED_MATCHING_SCHEDULE_CHANGE' | 'TEACHER_REFUSED_MATCHING_SCHEDULE_CHANGE' | 'MATCHING_SCHEDULE_CHANGE_EXPIRED' | 'ADMIN_CANCELED_OFFER' | 'TEACHER_BECAME_ROOKIE' | 'TEACHER_INTRO_NOT_WRITTEN_1_HOUR' | 'TEACHER_INTRO_NOT_WRITTEN_1_DAY' | 'TEACHER_INTRO_NOT_WRITTEN_3_DAY' | 'TEACHER_CONTRACT_NOT_SIGNED_IMMEDIATE' | 'TEACHER_CONTRACT_NOT_SIGNED_1_HOUR' | 'TEACHER_CONTRACT_NOT_SIGNED_1_DAY' | 'TEACHER_CONTRACT_NOT_SIGNED_3_DAY';
+export type BotMessageCtaType = 'MY_CLASS_CHECK' | 'OFFER_CHECK' | 'CHANGE_INFO_CHECK' | 'MY_APPLICATION_INFO_VIEW' | 'CARE_NOTE_CHECK' | 'TEACHER_SELECTION' | 'PLAY_CONTENT_EXPLORE' | 'ACTIVITY_GUIDEBOOK_VIEW' | 'INTRO_WRITE' | 'CONTRACT_SIGN';
 export type BotMessageCtaTargetTable = 'OFFER' | 'MATCHING';
 export type BotMessageSubCtaTargetTable = 'OFFER' | 'MATCHING';
 export interface BotMessageProps extends Omit<FlexboxProps, 'id' | 'title'> {

package/dist/shared/components/ChatKit/BotMessage/BotMessage.utils.d.ts

@@ -1,3 +1,3 @@
 import { BotMessageCtaType, BotMessageProps } from '.';
-export declare function getCtaButtonText(ctaType?: BotMessageCtaType | null): "" | "내 수업 확인하기" | "공고 확인하기" | "변경 내용 확인하기" | "나의 지원 내역 보러가기" | "돌봄노트 확인하기" | "선생님 선택하러 가기" | "놀이콘텐츠 둘러보기" | "활동 가이드북 보기";
+export declare function getCtaButtonText(ctaType?: BotMessageCtaType | null): "" | "내 수업 확인하기" | "공고 확인하기" | "변경 내용 확인하기" | "나의 지원 내역 보러가기" | "돌봄노트 확인하기" | "선생님 선택하러 가기" | "놀이콘텐츠 둘러보기" | "활동 가이드북 보기" | "자기소개 작성하기" | "계약서 서명하기";
 export declare function getBotMessageLabel({ title, content, regDatetime }: Pick<BotMessageProps, 'title' | 'content' | 'regDatetime'>): string;

package/dist/shared/components/ChatKit/BotMessage/BotMessage.utils.mjs

@@ -10,6 +10,8 @@ function t(e) {
 		case "TEACHER_SELECTION": return "선생님 선택하러 가기";
 		case "PLAY_CONTENT_EXPLORE": return "놀이콘텐츠 둘러보기";
 		case "ACTIVITY_GUIDEBOOK_VIEW": return "활동 가이드북 보기";
+		case "INTRO_WRITE": return "자기소개 작성하기";
+		case "CONTRACT_SIGN": return "계약서 서명하기";
 		default: return "";
 	}
 }

package/dist/shared/components/Swiper/Swiper.mjs

@@ -1,116 +1,117 @@
 import e from "./SwiperBlock/index.mjs";
 import t from "../MediaDialog/MediaBlock/index.mjs";
-import { createSwipeEvent as n } from "./Swiper.utils.mjs";
-import { Children as r, cloneElement as i, isValidElement as a, useCallback as o, useEffect as s, useRef as c, useState as l } from "react";
-import { Flexbox as u } from "@dotss/ui";
-import { jsxs as d } from "react/jsx-runtime";
+import { createSwipeEvent as n, getSwipingTranslateX as r } from "./Swiper.utils.mjs";
+import { Children as i, cloneElement as a, isValidElement as o, useCallback as s, useEffect as c, useRef as l, useState as u } from "react";
+import { Flexbox as d } from "@dotss/ui";
+import { jsxs as f } from "react/jsx-runtime";
 //#region shared/components/Swiper/Swiper.tsx
-function f({ children: f, initialPage: p = 0, onSwipe: m, onSwiping: h, loop: g = !1, disableSwipe: _ = !1, renderPagination: v, inlineCSS: y, autoSwipe: b = !1, autoSwipeInterval: x = 3e3, autoSwipeDuration: S = 1e3, ...C }) {
-	let [w, T] = l(p), [E, D] = l(1), O = c(null), k = c(0), A = c(0), j = c(0), M = c(0), N = c(!1), P = c(!0), F = c(""), I = c(p), L = c(!1), R = c(null), z = r.count(f), B = r.toArray(f).filter(a).filter((n) => n.type === e || n.type === t), V = z > 1 && !_, H = r.toArray(B?.[0]).filter(a).filter((n) => n.type === e || n.type === t), U = r.toArray(B?.[B?.length - 1]).filter(a).filter((n) => n.type === e || n.type === t), W = (e, t, n) => {
-		!O.current || !V || (F.current = O.current.style.transform, A.current = e, k.current = e + O.current.offsetWidth * (n + 1), j.current = t);
-	}, G = o((e, t, r, { isAutoSwiped: i = !1, shouldFocus: a = !1 } = {}) => {
-		if (!O.current || !V || !N.current || !P.current) return;
-		P.current = !1, O.current.style.transition = i ? `transform ${S}ms` : "transform 0.2s", O.current.style.cursor = "grab", R.current &&= (O.current.removeEventListener("transitionend", R.current), null);
-		let o = t || w, s = r || k.current - O.current.offsetWidth * (o + 1) - e, c = O.current.offsetWidth * .1;
+function p({ children: p, initialPage: m = 0, onSwipe: h, onSwiping: g, loop: _ = !1, disableSwipe: v = !1, renderPagination: y, inlineCSS: b, autoSwipe: x = !1, autoSwipeInterval: S = 3e3, autoSwipeDuration: C = 1e3, ...w }) {
+	let [T, E] = u(m), [D, O] = u(1), k = l(null), A = l(0), j = l(0), M = l(0), N = l(0), P = l(!1), F = l(!0), I = l(""), L = l(m), R = l(!1), z = l(null), B = i.count(p), V = i.toArray(p).filter(o).filter((n) => n.type === e || n.type === t), H = B > 1 && !v, U = i.toArray(V?.[0]).filter(o).filter((n) => n.type === e || n.type === t), W = i.toArray(V?.[V?.length - 1]).filter(o).filter((n) => n.type === e || n.type === t), G = (e, t, n) => {
+		!k.current || !H || (I.current = k.current.style.transform, j.current = e, A.current = e + k.current.offsetWidth * (n + 1), M.current = t);
+	}, K = s((e, t, r, { isAutoSwiped: i = !1, shouldFocus: a = !1 } = {}) => {
+		if (!k.current || !H || !P.current || !F.current) return;
+		F.current = !1, k.current.style.transition = i ? `transform ${C}ms` : "transform 0.2s", k.current.style.cursor = "grab", z.current &&= (k.current.removeEventListener("transitionend", z.current), null);
+		let o = t || T, s = r || A.current - k.current.offsetWidth * (o + 1) - e, c = k.current.offsetWidth * .1;
 		if (Math.abs(s) < c && !t) {
-			O.current.style.transform = F.current, N.current = !1, P.current = !0, m?.(n({
-				realPage: I.current,
-				totalPages: E,
-				lastPage: I.current,
+			k.current.style.transform = I.current, P.current = !1, F.current = !0, h?.(n({
+				realPage: L.current,
+				totalPages: D,
+				lastPage: L.current,
 				isLoop: !1
 			}));
 			return;
 		}
-		let l = s <= -c && o - 1 < 0, u = s >= c && o + 1 === E, d = s >= c && o + 1 < E, f = s <= -c && o - 1 >= 0;
+		let l = _ && s <= -c && o - 1 < 0, u = _ && s >= c && o + 1 === D, d = s >= c && o + 1 < D, f = s <= -c && o - 1 >= 0;
 		if (l) {
-			I.current = E - 1, m?.(n({
-				realPage: I.current,
-				totalPages: E,
+			L.current = D - 1, h?.(n({
+				realPage: L.current,
+				totalPages: D,
 				lastPage: 0,
 				isLoop: !0
-			})), O.current.style.transform = "translate3d(0, 0, 0)", R.current = (e) => {
+			})), k.current.style.transform = "translate3d(0, 0, 0)", z.current = (e) => {
 				if (e.propertyName === "transform") {
-					if (!O.current) return;
-					if (O.current.style.transition = "none", O.current.style.transform = `translate3d(calc(-100% * ${E}), 0, 0)`, T(E - 1), N.current = !1, P.current = !0, a) (O.current?.children)?.[E]?.focus();
+					if (!k.current) return;
+					if (k.current.style.transition = "none", k.current.style.transform = `translate3d(calc(-100% * ${D}), 0, 0)`, E(D - 1), P.current = !1, F.current = !0, a) (k.current?.children)?.[D]?.focus();
 					else {
 						if (i) return;
 						document.activeElement?.blur();
 					}
 				}
-			}, O.current.addEventListener("transitionend", R.current);
+			}, k.current.addEventListener("transitionend", z.current);
 			return;
 		} else if (u) {
-			I.current = 0, m?.(n({
-				realPage: I.current,
-				totalPages: E,
-				lastPage: E - 1,
+			L.current = 0, h?.(n({
+				realPage: L.current,
+				totalPages: D,
+				lastPage: D - 1,
 				isLoop: !0
-			})), O.current.style.transform = `translate3d(calc(-100% * ${o + 2}), 0, 0)`, R.current = (e) => {
+			})), k.current.style.transform = `translate3d(calc(-100% * ${o + 2}), 0, 0)`, z.current = (e) => {
 				if (e.propertyName === "transform") {
-					if (!O.current) return;
-					if (O.current.style.transition = "none", O.current.style.transform = "translate3d(-100%, 0, 0)", T(0), N.current = !1, P.current = !0, a) (O.current?.children)?.[1]?.focus();
+					if (!k.current) return;
+					if (k.current.style.transition = "none", k.current.style.transform = "translate3d(-100%, 0, 0)", E(0), P.current = !1, F.current = !0, a) (k.current?.children)?.[1]?.focus();
 					else {
 						if (i) return;
 						document.activeElement?.blur();
 					}
 				}
-			}, O.current.addEventListener("transitionend", R.current);
+			}, k.current.addEventListener("transitionend", z.current);
 			return;
 		}
-		d ? (I.current = o + 1, m?.(n({
-			realPage: I.current,
-			totalPages: E,
+		d ? (L.current = o + 1, h?.(n({
+			realPage: L.current,
+			totalPages: D,
 			lastPage: o,
 			isLoop: !0
-		})), T(I.current), O.current.style.transform = `translate3d(calc(-100% * ${o + 2}), 0, 0)`) : f ? (I.current = o - 1, m?.(n({
-			realPage: I.current,
-			totalPages: E,
+		})), E(L.current), k.current.style.transform = `translate3d(calc(-100% * ${o + 2}), 0, 0)`) : f ? (L.current = o - 1, h?.(n({
+			realPage: L.current,
+			totalPages: D,
 			lastPage: o,
 			isLoop: !1
-		})), T(I.current), O.current.style.transform = `translate3d(calc(-100% * ${o}), 0, 0)`) : (m?.(n({
-			realPage: I.current,
-			totalPages: E,
-			lastPage: I.current,
+		})), E(L.current), k.current.style.transform = `translate3d(calc(-100% * ${o}), 0, 0)`) : (h?.(n({
+			realPage: L.current,
+			totalPages: D,
+			lastPage: L.current,
 			isLoop: !1
-		})), O.current.style.transform = F.current), R.current = (e) => {
+		})), k.current.style.transform = I.current), z.current = (e) => {
 			if (e.propertyName === "transform") {
-				N.current = !1, P.current = !0;
-				let e = Array.from(O.current?.children ?? []).find((e) => e.getAttribute("aria-current") === "page");
+				P.current = !1, F.current = !0;
+				let e = Array.from(k.current?.children ?? []).find((e) => e.getAttribute("aria-current") === "page");
 				if (a && e) e.focus();
 				else {
 					if (i) return;
 					document.activeElement?.blur();
 				}
 			}
-		}, O.current.addEventListener("transitionend", R.current);
+		}, k.current.addEventListener("transitionend", z.current);
 	}, [
-		w,
-		E,
-		m,
-		V,
-		S
-	]), K = (e) => {
-		N.current = !0, W(e.clientX, e.clientY, I.current);
-	}, q = (e) => G(e.clientX), J = (e) => {
-		W(e.touches[0].clientX, e.touches[0].clientY, I.current);
-	}, Y = (e) => G(e.changedTouches[0].clientX), X = (e) => {
-		N.current = !0;
+		T,
+		D,
+		h,
+		H,
+		C,
+		_
+	]), q = (e) => {
+		P.current = !0, G(e.clientX, e.clientY, L.current);
+	}, J = (e) => K(e.clientX), Y = (e) => {
+		G(e.touches[0].clientX, e.touches[0].clientY, L.current);
+	}, X = (e) => K(e.changedTouches[0].clientX), Z = (e) => {
+		P.current = !0;
 		let t = e - 1;
-		T(t <= 0 ? 0 : t), G(0, e);
-	}, Z = (e) => (t) => {
+		E(t <= 0 ? 0 : t), K(0, e);
+	}, Q = (e) => (t) => {
 		switch (t.key) {
 			case "ArrowRight": {
-				if (t.preventDefault(), N.current || !P.current) return;
-				let e = I.current === E - 1;
-				if (!g && e) return;
-				N.current = !0, G(0, I.current, (O.current?.offsetWidth ?? 0) * .1, { shouldFocus: !0 });
+				if (t.preventDefault(), P.current || !F.current) return;
+				let e = L.current === D - 1;
+				if (!_ && e) return;
+				P.current = !0, K(0, L.current, (k.current?.offsetWidth ?? 0) * .1, { shouldFocus: !0 });
 				break;
 			}
 			case "ArrowLeft": {
-				if (t.preventDefault(), N.current || !P.current) return;
-				let e = I.current === 0;
-				if (!g && e) return;
-				N.current = !0, G(0, I.current, -((O.current?.offsetWidth ?? 0) * .1), { shouldFocus: !0 });
+				if (t.preventDefault(), P.current || !F.current) return;
+				let e = L.current === 0;
+				if (!_ && e) return;
+				P.current = !0, K(0, L.current, -((k.current?.offsetWidth ?? 0) * .1), { shouldFocus: !0 });
 				break;
 			}
 			case "Enter":
@@ -122,90 +123,90 @@ function f({ children: f, initialPage: p = 0, onSwipe: m, onSwiping: h, loop: g
 		}
 		e?.(t);
 	};
-	return s(() => {
-		let e = O.current, t = (e, t, r) => {
-			if (!(!O.current || !V || !P.current) && (M.current = e - k.current, N.current = N.current || Math.abs(M.current) > 5 && Math.abs(t - j.current) < 5, N.current)) {
-				let t = A.current < e, i = A.current > e;
-				if (!g && t && I.current === 0) {
-					N.current = !1;
-					return;
-				}
-				if (!g && i && I.current === E - 1) {
-					N.current = !1;
-					return;
-				}
-				r.cancelable && r.preventDefault(), h?.(n({
-					realPage: I.current,
-					totalPages: E,
-					lastPage: I.current,
+	return c(() => {
+		let e = k.current, t = (e, t, i) => {
+			if (!(!k.current || !H || !F.current) && (N.current = e - A.current, P.current = P.current || Math.abs(N.current) > 5 && Math.abs(t - M.current) < 5, P.current)) {
+				i.cancelable && i.preventDefault(), g?.(n({
+					realPage: L.current,
+					totalPages: D,
+					lastPage: L.current,
 					isLoop: !1
-				})), O.current.style.transition = "none", O.current.style.cursor = "grabbing", O.current.style.transform = `translate3d(${M.current}px, 0, 0)`;
+				}));
+				let t = r({
+					rawTranslateX: N.current,
+					fingerDeltaX: e - j.current,
+					page: L.current,
+					totalPages: D,
+					width: k.current.offsetWidth,
+					loop: _
+				});
+				k.current.style.transition = "none", k.current.style.cursor = "grabbing", k.current.style.transform = `translate3d(${t}px, 0, 0)`;
 			}
-		}, r = (e) => {
-			N.current && t(e.clientX, e.clientY, e);
-		}, i = (e) => t(e.touches[0].clientX, e.touches[0].clientY, e);
-		return e && (e.addEventListener("mousemove", r), e.addEventListener("touchmove", i)), () => {
-			e && (e.removeEventListener("mousemove", r), e.removeEventListener("touchmove", i));
+		}, i = (e) => {
+			P.current && t(e.clientX, e.clientY, e);
+		}, a = (e) => t(e.touches[0].clientX, e.touches[0].clientY, e);
+		return e && (e.addEventListener("mousemove", i), e.addEventListener("touchmove", a)), () => {
+			e && (e.removeEventListener("mousemove", i), e.removeEventListener("touchmove", a));
 		};
 	}, [
-		V,
-		h,
+		H,
 		g,
-		E
-	]), s(() => {
-		let e = O.current, t = (e) => {
-			P.current || (e.stopPropagation(), e.preventDefault());
+		_,
+		D
+	]), c(() => {
+		let e = k.current, t = (e) => {
+			F.current || (e.stopPropagation(), e.preventDefault());
 		};
 		return e?.addEventListener("click", t), () => {
 			e?.removeEventListener("click", t);
 		};
-	}, []), s(() => {
-		let e = O.current;
+	}, []), c(() => {
+		let e = k.current;
 		return () => {
-			R.current && e && (e.removeEventListener("transitionend", R.current), R.current = null);
+			z.current && e && (e.removeEventListener("transitionend", z.current), z.current = null);
 		};
-	}, []), s(() => {
-		D(z);
-	}, [z]), s(() => {
-		O.current && !L.current && (L.current = !0, O.current.style.transition = "none", O.current.style.transform = `translate3d(calc(-100% * ${z < p + 1 ? z : p + 1}), 0, 0)`);
-	}, [p, z]), s(() => {
-		if (b) {
+	}, []), c(() => {
+		O(B);
+	}, [B]), c(() => {
+		k.current && !R.current && (R.current = !0, k.current.style.transition = "none", k.current.style.transform = `translate3d(calc(-100% * ${B < m + 1 ? B : m + 1}), 0, 0)`);
+	}, [m, B]), c(() => {
+		if (x) {
 			let e = setInterval(() => {
-				N.current || !P.current || O.current && (!g && I.current === E - 1 || document.activeElement && O.current && O.current.contains(document.activeElement) || (N.current = !0, G(0, I.current, (O.current.offsetWidth ?? 0) * .1, { isAutoSwiped: !0 })));
-			}, x);
+				P.current || !F.current || k.current && (!_ && L.current === D - 1 || document.activeElement && k.current && k.current.contains(document.activeElement) || (P.current = !0, K(0, L.current, (k.current.offsetWidth ?? 0) * .1, { isAutoSwiped: !0 })));
+			}, S);
 			return () => {
 				clearInterval(e);
 			};
 		}
 	}, [
-		b,
 		x,
-		g,
-		E,
-		G
-	]), /* @__PURE__ */ d(u, {
+		S,
+		_,
+		D,
+		K
+	]), /* @__PURE__ */ f(d, {
 		flexGrow: 1,
 		role: "list",
 		"aria-roledescription": "carousel",
 		"aria-label": "슬라이더",
-		...C,
+		...w,
 		inlineCSS: {
 			width: "100%",
 			position: "relative",
-			...y
+			...b
 		},
-		children: [/* @__PURE__ */ d(u, {
-			ref: O,
+		children: [/* @__PURE__ */ f(d, {
+			ref: k,
 			flexGrow: 1,
-			onMouseDown: K,
-			onMouseUp: q,
-			onMouseLeave: q,
-			onTouchStart: J,
-			onTouchEnd: Y,
-			onTouchCancel: Y,
+			onMouseDown: q,
+			onMouseUp: J,
+			onMouseLeave: J,
+			onTouchStart: Y,
+			onTouchEnd: X,
+			onTouchCancel: X,
 			inlineCSS: {
-				"& > div:first-of-type": { visibility: g ? "visible" : "hidden" },
-				"& > div:last-of-type": { visibility: g ? "visible" : "hidden" }
+				"& > div:first-of-type": { visibility: _ ? "visible" : "hidden" },
+				"& > div:last-of-type": { visibility: _ ? "visible" : "hidden" }
 			},
 			style: {
 				transition: "transform 0.2s",
@@ -213,27 +214,27 @@ function f({ children: f, initialPage: p = 0, onSwipe: m, onSwiping: h, loop: g
 				cursor: "grab"
 			},
 			children: [
-				U,
-				B.map((e, t) => i(e, {
+				W,
+				V.map((e, t) => a(e, {
 					role: "listitem",
-					tabIndex: t === w ? 0 : -1,
-					onKeyDown: Z(e.props.onKeyDown),
+					tabIndex: t === T ? 0 : -1,
+					onKeyDown: Q(e.props.onKeyDown),
 					"aria-roledescription": "slide",
-					"aria-hidden": t !== w,
-					"aria-current": t === w ? "page" : void 0,
-					"aria-label": `${E}개 중 ${t + 1}번째 슬라이드`,
+					"aria-hidden": t !== T,
+					"aria-current": t === T ? "page" : void 0,
+					"aria-label": `${D}개 중 ${t + 1}번째 슬라이드`,
 					"aria-posinset": t + 1,
-					"aria-setsize": E,
+					"aria-setsize": D,
 					...e.props
 				})),
-				H
+				U
 			]
-		}), typeof v == "function" && v({
-			page: w,
-			totalPages: E,
-			onChange: X
+		}), typeof y == "function" && y({
+			page: T,
+			totalPages: D,
+			onChange: Z
 		})]
 	});
 }
 //#endregion
-export { f as default };
+export { p as default };

package/dist/shared/components/Swiper/Swiper.utils.d.ts

@@ -1,3 +1,13 @@
+export declare const EDGE_RESISTANCE = 0.35;
+export declare function addDamping(distance: number, maxDistance: number, constant?: number): number;
+export declare function getSwipingTranslateX({ rawTranslateX, fingerDeltaX, page, totalPages, width, loop }: {
+    rawTranslateX: number;
+    fingerDeltaX: number;
+    page: number;
+    totalPages: number;
+    width: number;
+    loop: boolean;
+}): number;
 export declare function createSwipeEvent({ realPage, totalPages, lastPage, isLoop }: {
     realPage: number;
     totalPages: number;

package/dist/shared/components/Swiper/Swiper.utils.mjs

@@ -1,5 +1,16 @@
 //#region shared/components/Swiper/Swiper.utils.ts
-function e({ realPage: e, totalPages: t, lastPage: n, isLoop: r }) {
+var e = .35;
+function t(t, n, r = e) {
+	if (t === 0 || n <= 0) return 0;
+	let i = Math.abs(t), a = i * n * r / (n + r * i);
+	return Math.sign(t) * a;
+}
+function n({ rawTranslateX: e, fingerDeltaX: n, page: r, totalPages: i, width: a, loop: o }) {
+	if (o) return e;
+	let s = r === 0 && n > 0, c = r === i - 1 && n < 0;
+	return !s && !c ? e : -a * (r + 1) + t(n, a);
+}
+function r({ realPage: e, totalPages: t, lastPage: n, isLoop: r }) {
 	return r ? {
 		isFirstPage: e === 0,
 		isLastPage: e === t - 1,
@@ -17,4 +28,4 @@ function e({ realPage: e, totalPages: t, lastPage: n, isLoop: r }) {
 	};
 }
 //#endregion
-export { e as createSwipeEvent };
+export { e as EDGE_RESISTANCE, t as addDamping, r as createSwipeEvent, n as getSwipingTranslateX };

package/dist/shared/components/Swiper/Swiper.utils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dotss/tictoccroc",
   "type": "module",
-  "version": "0.11.0",
+  "version": "0.11.2",
   "description": "Tictoccroc shared components, hooks, utils, and APIs for Dotss",
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",