@athbnb/ui 0.0.2 → 0.0.3

package/dist/ui/ImagePreviewModal.js

@@ -0,0 +1,120 @@
+import { Modal as e } from "./Modal.js";
+import { c as t } from "react/compiler-runtime";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+import { useEffect as a, useState as o } from "react";
+//#region src/ui/ImagePreviewModal.tsx
+function s(e) {
+	let n = t(3), { className: i } = e, a;
+	n[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ r("path", { d: "M18 6L6 18M6 6l12 12" }), n[0] = a) : a = n[0];
+	let o;
+	return n[1] === i ? o = n[2] : (o = /* @__PURE__ */ r("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		className: i,
+		"aria-hidden": !0,
+		children: a
+	}), n[1] = i, n[2] = o), o;
+}
+function c(e) {
+	let n = t(2), { dir: i } = e, a;
+	return n[0] === i ? a = n[1] : (a = /* @__PURE__ */ r("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		className: "h-4 w-4 fill-primary",
+		"aria-hidden": !0,
+		children: i === "left" ? /* @__PURE__ */ r("path", { d: "M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z" }) : /* @__PURE__ */ r("path", { d: "M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" })
+	}), n[0] = i, n[1] = a), a;
+}
+function l(e) {
+	return ["relative !max-w-[min(96vw,1200px)] w-full overflow-hidden p-0", e].filter(Boolean).join(" ");
+}
+function u(e) {
+	let l = t(19), { images: u, initialIndex: d, imageUrl: f, placeholderUrl: p, className: m, alt: h, onClose: g } = e, _ = d === void 0 ? 0 : d, v = Math.max(0, u.length - 1), [y, b] = o(Math.min(Math.max(0, _), v)), x, S;
+	l[0] === u.length ? (x = l[1], S = l[2]) : (x = () => {
+		if (u.length <= 1) return;
+		let e = (e) => {
+			e.key === "ArrowLeft" && (e.preventDefault(), b((e) => (e - 1 + u.length) % u.length)), e.key === "ArrowRight" && (e.preventDefault(), b((e) => (e + 1) % u.length));
+		};
+		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
+	}, S = [u.length], l[0] = u.length, l[1] = x, l[2] = S), a(x, S);
+	let C = u.length > 1, w = u[y] ?? f ?? p ?? "", T;
+	l[3] === Symbol.for("react.memo_cache_sentinel") ? (T = /* @__PURE__ */ r(s, { className: "h-5 w-5" }), l[3] = T) : T = l[3];
+	let E;
+	l[4] === g ? E = l[5] : (E = /* @__PURE__ */ r("button", {
+		type: "button",
+		onClick: g,
+		className: "absolute top-3 right-3 z-10 cursor-pointer text-gray-400 transition-colors hover:text-gray-500 sm:top-5 sm:right-5",
+		"aria-label": "Close",
+		children: T
+	}), l[4] = g, l[5] = E);
+	let D;
+	l[6] !== h || l[7] !== m || l[8] !== w ? (D = w ? /* @__PURE__ */ r("img", {
+		src: w,
+		className: `block max-h-[68vh] w-auto max-w-full rounded-lg object-contain ${m}`.trim(),
+		alt: h
+	}) : /* @__PURE__ */ r("div", {
+		className: "flex min-h-[40vh] items-center justify-center px-4 text-center paragraph-text text-secondary",
+		children: "No image URL provided."
+	}), l[6] = h, l[7] = m, l[8] = w, l[9] = D) : D = l[9];
+	let O;
+	l[10] !== C || l[11] !== u.length ? (O = C ? /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r("button", {
+		type: "button",
+		className: "absolute left-2 flex h-9 w-9 items-center justify-center rounded-md border border-primary/50 bg-white/90 sm:left-4",
+		onClick: () => b((e) => (e - 1 + u.length) % u.length),
+		"aria-label": "Previous image",
+		children: /* @__PURE__ */ r(c, { dir: "left" })
+	}), /* @__PURE__ */ r("button", {
+		type: "button",
+		className: "absolute right-2 flex h-9 w-9 items-center justify-center rounded-md border border-primary/50 bg-white/90 sm:right-4",
+		onClick: () => b((e) => (e + 1) % u.length),
+		"aria-label": "Next image",
+		children: /* @__PURE__ */ r(c, { dir: "right" })
+	})] }) : null, l[10] = C, l[11] = u.length, l[12] = O) : O = l[12];
+	let k;
+	l[13] !== D || l[14] !== O ? (k = /* @__PURE__ */ i("div", {
+		className: "relative flex items-center justify-center px-10 py-8 sm:px-14 sm:py-10",
+		children: [D, O]
+	}), l[13] = D, l[14] = O, l[15] = k) : k = l[15];
+	let A;
+	return l[16] !== E || l[17] !== k ? (A = /* @__PURE__ */ i(n, { children: [E, k] }), l[16] = E, l[17] = k, l[18] = A) : A = l[18], A;
+}
+function d(n) {
+	let i = t(25), { isOpen: a, onClose: o, imageUrl: s, imageUrls: c, initialIndex: d, className: f, modalClassName: p, alt: m, placeholderUrl: h } = n, g;
+	i[0] === c ? g = i[1] : (g = c === void 0 ? [] : c, i[0] = c, i[1] = g);
+	let _ = g, v = d === void 0 ? 0 : d, y = f === void 0 ? "" : f, b = p === void 0 ? "" : p, x = m === void 0 ? "Preview" : m, S;
+	bb0: {
+		if (Array.isArray(_) && _.length > 0) {
+			let e;
+			i[2] === _ ? e = i[3] : (e = _.filter(Boolean), i[2] = _, i[3] = e), S = e;
+			break bb0;
+		}
+		let e;
+		i[4] === s ? e = i[5] : (e = s ? [s] : [], i[4] = s, i[5] = e), S = e;
+	}
+	let C = S, w;
+	i[6] === C ? w = i[7] : (w = C.join("
"), i[6] = C, i[7] = w);
+	let T = `${w}::${v}`, E;
+	i[8] === b ? E = i[9] : (E = l(b), i[8] = b, i[9] = E);
+	let D;
+	i[10] !== x || i[11] !== y || i[12] !== s || i[13] !== C || i[14] !== v || i[15] !== a || i[16] !== o || i[17] !== T || i[18] !== h ? (D = a ? /* @__PURE__ */ r(u, {
+		images: C,
+		initialIndex: v,
+		imageUrl: s,
+		placeholderUrl: h,
+		className: y,
+		alt: x,
+		onClose: o
+	}, T) : null, i[10] = x, i[11] = y, i[12] = s, i[13] = C, i[14] = v, i[15] = a, i[16] = o, i[17] = T, i[18] = h, i[19] = D) : D = i[19];
+	let O;
+	return i[20] !== a || i[21] !== o || i[22] !== D || i[23] !== E ? (O = /* @__PURE__ */ r(e, {
+		isOpen: a,
+		onClose: o,
+		className: E,
+		children: D
+	}), i[20] = a, i[21] = o, i[22] = D, i[23] = E, i[24] = O) : O = i[24], O;
+}
+//#endregion
+export { d as ImagePreviewModal };

package/dist/ui/List.js

@@ -0,0 +1,56 @@
+import { c as e } from "react/compiler-runtime";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/ui/List.tsx
+var r = "text-secondary paragraph-text leading-relaxed whitespace-pre-line", i = "list-disc pl-5 text-secondary paragraph-text leading-relaxed space-y-2", a = "text-secondary paragraph-text leading-relaxed space-y-2", o = `${r}`, s = "text-base sm:text-lg md:text-xl font-bold text-secondary w-full text-left block";
+function c(c) {
+	let l = e(29), { content: u, variant: d, headerSubtitle: f, className: p, listClassName: m, listItemClassName: h, blocksWrapperClassName: g, blockClassName: _, paragraphClassName: v, headerSubtitleClassName: y } = c, b = d === void 0 ? "bullets" : d, x = p === void 0 ? "" : p, S = m === void 0 ? "" : m, C = h === void 0 ? "" : h, w = g === void 0 ? "" : g, T = _ === void 0 ? "" : _, E = v === void 0 ? "" : v, D = y === void 0 ? "" : y;
+	if (Array.isArray(u)) {
+		if (u.length === 0) return null;
+		if (b === "bullets") {
+			let e = `${i} ${S} ${x}`, n;
+			l[0] === e ? n = l[1] : (n = e.trim(), l[0] = e, l[1] = n);
+			let r;
+			if (l[2] !== u || l[3] !== C) {
+				let e;
+				l[5] === C ? e = l[6] : (e = (e, n) => /* @__PURE__ */ t("li", {
+					className: C.trim() || void 0,
+					children: e
+				}, n), l[5] = C, l[6] = e), r = u.map(e), l[2] = u, l[3] = C, l[4] = r;
+			} else r = l[4];
+			let a;
+			return l[7] !== n || l[8] !== r ? (a = /* @__PURE__ */ t("ul", {
+				className: n,
+				children: r
+			}), l[7] = n, l[8] = r, l[9] = a) : a = l[9], a;
+		}
+		let e = `${a} ${w} ${x}`, r;
+		l[10] === e ? r = l[11] : (r = e.trim(), l[10] = e, l[11] = r);
+		let c;
+		l[12] !== f || l[13] !== D ? (c = f ? /* @__PURE__ */ t("span", {
+			className: `${s} ${D}`.trim(),
+			children: f
+		}) : null, l[12] = f, l[13] = D, l[14] = c) : c = l[14];
+		let d;
+		if (l[15] !== T || l[16] !== u) {
+			let e;
+			l[18] === T ? e = l[19] : (e = (e, n) => /* @__PURE__ */ t("p", {
+				className: `${o} ${T}`.trim(),
+				children: e
+			}, n), l[18] = T, l[19] = e), d = u.map(e), l[15] = T, l[16] = u, l[17] = d;
+		} else d = l[17];
+		let p;
+		return l[20] !== r || l[21] !== c || l[22] !== d ? (p = /* @__PURE__ */ n("div", {
+			className: r,
+			children: [c, d]
+		}), l[20] = r, l[21] = c, l[22] = d, l[23] = p) : p = l[23], p;
+	}
+	let O = `${r} ${E} ${x}`, k;
+	l[24] === O ? k = l[25] : (k = O.trim(), l[24] = O, l[25] = k);
+	let A;
+	return l[26] !== u || l[27] !== k ? (A = /* @__PURE__ */ t("p", {
+		className: k,
+		children: u
+	}), l[26] = u, l[27] = k, l[28] = A) : A = l[28], A;
+}
+//#endregion
+export { c as List };

package/dist/ui/Loader.js

@@ -0,0 +1,115 @@
+import { c as e } from "react/compiler-runtime";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/ui/Loader.tsx
+function r(n) {
+	let r = e(8), { loadingClass: i, pulseDotClass: a, dotColorClass: o, className: s } = n, c = i === void 0 ? "" : i, l = a === void 0 ? "" : a, u = o === void 0 ? "bg-primary" : o, d = `flex items-center space-x-2.5 py-2 ${c} ${s === void 0 ? "" : s}`, f;
+	r[0] === d ? f = r[1] : (f = d.trim(), r[0] = d, r[1] = f);
+	let p;
+	r[2] !== u || r[3] !== l ? (p = Array.from({ length: 3 }, (e, n) => /* @__PURE__ */ t("div", { className: `h-2 w-2 rounded-full pulse-scale-dot ${u} ${l}`.trim() }, n)), r[2] = u, r[3] = l, r[4] = p) : p = r[4];
+	let m;
+	return r[5] !== f || r[6] !== p ? (m = /* @__PURE__ */ t("div", {
+		className: f,
+		role: "status",
+		"aria-label": "Loading",
+		"aria-live": "polite",
+		children: p
+	}), r[5] = f, r[6] = p, r[7] = m) : m = r[7], m;
+}
+function i(r) {
+	let i = e(28), { fullScreen: a, className: o, svgWidth: s, heartColor: c, diamondColor: l } = r, u = a === void 0 ? !0 : a, d = o === void 0 ? "" : o, f = s === void 0 ? 300 : s, p = c === void 0 ? "#00BC78" : c, m = l === void 0 ? "#0072D8" : l, h;
+	i[0] === f ? h = i[1] : (h = { width: f }, i[0] = f, i[1] = h);
+	let g;
+	i[2] === p ? g = i[3] : (g = { color: p }, i[2] = p, i[3] = g);
+	let _;
+	i[4] === Symbol.for("react.memo_cache_sentinel") ? (_ = /* @__PURE__ */ t("path", {
+		className: "logo-path logo-heart-green",
+		d: "M532.8 41C532.8 51.2 529 61.5 521.3 69.4L487.8 104.2L431 163.2L372 106.4L339.7 75.3C323.4 59.6 322.9 33.7 338.6 17.4C346.7 9 357.4 4.8 368.1 4.8C378.3 4.8 388.6 8.6 396.5 16.3L428.8 47.4L462.3 12.6C478 -3.7 504 -4.2 520.3 11.5C528.6 19.5 532.8 30.2 532.8 41Z"
+	}), i[4] = _) : _ = i[4];
+	let v;
+	i[5] === g ? v = i[6] : (v = /* @__PURE__ */ t("g", {
+		style: g,
+		children: _
+	}), i[5] = g, i[6] = v);
+	let y;
+	i[7] === m ? y = i[8] : (y = { color: m }, i[7] = m, i[8] = y);
+	let b;
+	i[9] === Symbol.for("react.memo_cache_sentinel") ? (b = /* @__PURE__ */ t("path", {
+		className: "logo-path logo-diamond-blue",
+		d: "M682.1 291.2L625.3 350.2L559.4 286.8L492.9 356L492.7 356.1L492.9 356.2L554.6 415.6L497.7 474.7L436 415.3L435.9 415.1L435.8 415.3L374 479.5L314.9 422.6L376.7 358.4L376.9 358.3L376.7 358.2L307.7 291.8L307.5 291.6L307.3 291.8L246.5 355L187.4 298.1L248.3 234.9L248.5 234.7L248.2 234.5L182.6 171.3L239.5 112.3L305.1 175.5L305.3 175.7L305.5 175.5L372 106.4L431 163.2L364.6 232.3L364.3 232.5L364.6 232.7L433.6 299.1L433.7 299.3L433.8 299.1L500.4 230L431 163.2L487.9 104.2L557.2 170.9L618.3 107.5L677.3 164.4L616.2 227.8L682.1 291.2Z"
+	}), i[9] = b) : b = i[9];
+	let x;
+	i[10] === y ? x = i[11] : (x = /* @__PURE__ */ t("g", {
+		style: y,
+		children: b
+	}), i[10] = y, i[11] = x);
+	let S;
+	i[12] !== x || i[13] !== v ? (S = /* @__PURE__ */ n("svg", {
+		viewBox: "0 0 865 685",
+		xmlns: "http://www.w3.org/2000/svg",
+		children: [v, x]
+	}), i[12] = x, i[13] = v, i[14] = S) : S = i[14];
+	let C;
+	i[15] !== S || i[16] !== h ? (C = /* @__PURE__ */ t("div", {
+		className: "relative",
+		children: /* @__PURE__ */ t("div", {
+			className: "icon-loader",
+			style: h,
+			children: S
+		})
+	}), i[15] = S, i[16] = h, i[17] = C) : C = i[17];
+	let w = C;
+	if (!u) {
+		let e = `flex items-center justify-center ${d}`, n;
+		i[18] === e ? n = i[19] : (n = e.trim(), i[18] = e, i[19] = n);
+		let r;
+		return i[20] !== w || i[21] !== n ? (r = /* @__PURE__ */ t("div", {
+			className: n,
+			role: "status",
+			"aria-label": "Loading",
+			"aria-live": "polite",
+			children: w
+		}), i[20] = w, i[21] = n, i[22] = r) : r = i[22], r;
+	}
+	let T = `fixed inset-0 z-50 flex items-center justify-center bg-white ${d}`, E;
+	i[23] === T ? E = i[24] : (E = T.trim(), i[23] = T, i[24] = E);
+	let D;
+	return i[25] !== w || i[26] !== E ? (D = /* @__PURE__ */ t("div", {
+		className: E,
+		role: "status",
+		"aria-label": "Loading",
+		"aria-live": "polite",
+		children: w
+	}), i[25] = w, i[26] = E, i[27] = D) : D = i[27], D;
+}
+function a(r) {
+	let i = e(10), { sizeClass: a, className: o } = r, s = a === void 0 ? "h-24 w-24" : a, c = `relative ${o === void 0 ? "" : o}`, l;
+	i[0] === c ? l = i[1] : (l = c.trim(), i[0] = c, i[1] = l);
+	let u = `${s} rounded-full border-b-8 border-t-8 border-primary/50`, d;
+	i[2] === u ? d = i[3] : (d = /* @__PURE__ */ t("div", { className: u }), i[2] = u, i[3] = d);
+	let f = `absolute top-0 left-0 ${s} animate-spin rounded-full border-b-8 border-t-8 border-primary`, p;
+	i[4] === f ? p = i[5] : (p = /* @__PURE__ */ t("div", { className: f }), i[4] = f, i[5] = p);
+	let m;
+	return i[6] !== l || i[7] !== d || i[8] !== p ? (m = /* @__PURE__ */ n("div", {
+		className: l,
+		children: [d, p]
+	}), i[6] = l, i[7] = d, i[8] = p, i[9] = m) : m = i[9], m;
+}
+function o(n) {
+	let r = e(8), { sizeClass: i, className: o, backdropClassName: s } = n, c = o === void 0 ? "" : o, l = `fixed inset-0 z-50 flex items-center justify-center bg-white ${s === void 0 ? "" : s}`, u;
+	r[0] === l ? u = r[1] : (u = l.trim(), r[0] = l, r[1] = u);
+	let d;
+	r[2] !== c || r[3] !== i ? (d = /* @__PURE__ */ t(a, {
+		sizeClass: i,
+		className: c
+	}), r[2] = c, r[3] = i, r[4] = d) : d = r[4];
+	let f;
+	return r[5] !== u || r[6] !== d ? (f = /* @__PURE__ */ t("div", {
+		className: u,
+		role: "status",
+		"aria-label": "Loading",
+		"aria-live": "polite",
+		children: d
+	}), r[5] = u, r[6] = d, r[7] = f) : f = r[7], f;
+}
+//#endregion
+export { i as IconLoader, r as Loader, a as RingSpinner, o as RingSpinnerOverlay };

package/dist/ui/Modal.js

@@ -0,0 +1,53 @@
+import { c as e } from "react/compiler-runtime";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { useEffect as r } from "react";
+import { createPortal as i } from "react-dom";
+//#region src/ui/Modal.tsx
+function a(a) {
+	let s = e(18), { isOpen: c, onClose: l, children: u, className: d, zIndexClass: f, closeOnBackdropClick: p, contentId: m } = a, h = d === void 0 ? "" : d, g = f === void 0 ? "z-[1500]" : f, _ = p === void 0 ? !0 : p, v, y;
+	if (s[0] !== c || s[1] !== l ? (v = () => {
+		if (!c) return;
+		let e = (e) => {
+			e.key === "Escape" && l();
+		}, t = document.body.style.overflow;
+		return document.addEventListener("keydown", e), document.body.style.overflow = "hidden", () => {
+			document.removeEventListener("keydown", e), document.body.style.overflow = t;
+		};
+	}, y = [c, l], s[0] = c, s[1] = l, s[2] = v, s[3] = y) : (v = s[2], y = s[3]), r(v, y), !c || typeof document > "u") return null;
+	let b = `fixed inset-0 flex items-center justify-center p-2 ${g}`, x;
+	s[4] !== _ || s[5] !== l ? (x = /* @__PURE__ */ t("div", {
+		className: "absolute inset-0 bg-black/50 backdrop-blur-md",
+		"aria-hidden": !0,
+		onClick: () => {
+			_ && l();
+		}
+	}), s[4] = _, s[5] = l, s[6] = x) : x = s[6];
+	let S = `relative z-10 w-full max-w-[420px] rounded-primary bg-white shadow-primary sm:max-w-[700px] md:max-w-[800px] ${h}`, C;
+	s[7] === S ? C = s[8] : (C = S.trim(), s[7] = S, s[8] = C);
+	let w;
+	s[9] === Symbol.for("react.memo_cache_sentinel") ? (w = {
+		maxHeight: "80vh",
+		overflowY: "auto"
+	}, s[9] = w) : w = s[9];
+	let T;
+	s[10] !== u || s[11] !== m || s[12] !== C ? (T = /* @__PURE__ */ t("div", {
+		id: m,
+		role: "dialog",
+		"aria-modal": "true",
+		className: C,
+		style: w,
+		onClick: o,
+		children: u
+	}), s[10] = u, s[11] = m, s[12] = C, s[13] = T) : T = s[13];
+	let E;
+	return s[14] !== T || s[15] !== b || s[16] !== x ? (E = i(/* @__PURE__ */ n("div", {
+		className: b,
+		role: "presentation",
+		children: [x, T]
+	}), document.body), s[14] = T, s[15] = b, s[16] = x, s[17] = E) : E = s[17], E;
+}
+function o(e) {
+	return e.stopPropagation();
+}
+//#endregion
+export { a as Modal };

package/dist/ui/ProgressBar.js

@@ -0,0 +1,167 @@
+import { c as ee } from "react/compiler-runtime";
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { useEffect as te, useState as n } from "react";
+//#region src/ui/ProgressBar.tsx
+function r(r) {
+	let i = ee(59), { progress: a, currentStep: o, totalSteps: s, height: c, bgColor: l, fillColor: u, animated: d, showPercentage: f, showMovingPercentage: ne, showMovingIcon: re, showStepNumbers: p, icon: ie, duration: m, label: h, progressLabel: g, iconClassName: _, className: v } = r, y = a === void 0 ? 0 : a, b = o === void 0 ? null : o, x = s === void 0 ? null : s, S = c === void 0 ? "h-2" : c, C = l === void 0 ? "bg-primary/50" : l, w = u === void 0 ? "bg-primary" : u, T = d === void 0 ? !0 : d, E = f === void 0 ? !0 : f, D = ne === void 0 ? !0 : ne, O = re === void 0 ? !0 : re, k = p === void 0 ? !1 : p, A = ie === void 0 ? null : ie, j = m === void 0 ? 3e3 : m, M = h === void 0 ? "" : h, N = _ === void 0 ? "" : _, P = v === void 0 ? "" : v, [F, I] = n(0), L = b != null && x != null && x > 0, R = L ? Math.min(b / x * 100, 100) : y, z, B;
+	i[0] !== T || i[1] !== R ? (z = () => {
+		if (!T) return;
+		let ee = window.setTimeout(() => {
+			I(R);
+		}, 100);
+		return () => window.clearTimeout(ee);
+	}, B = [R, T], i[0] = T, i[1] = R, i[2] = z, i[3] = B) : (z = i[2], B = i[3]), te(z, B);
+	let V = Math.min(Math.max(T ? F : R, 0), 100), H;
+	i[4] !== V || i[5] !== b || i[6] !== L || i[7] !== g || i[8] !== k || i[9] !== x ? (H = () => g ?? (L && k ? `${b}/${x}` : `${Math.round(V)}%`), i[4] = V, i[5] = b, i[6] = L, i[7] = g, i[8] = k, i[9] = x, i[10] = H) : H = i[10];
+	let U = H, ae = typeof A == "string" && L ? b : A, oe = !!M || E, se = `relative w-full space-y-2 ${P}`, W;
+	i[11] === se ? W = i[12] : (W = se.trim(), i[11] = se, i[12] = W);
+	let G;
+	i[13] !== b || i[14] !== U || i[15] !== L || i[16] !== M || i[17] !== D || i[18] !== E || i[19] !== k || i[20] !== oe || i[21] !== x ? (G = oe ? /* @__PURE__ */ t("div", {
+		className: "flex items-center justify-between text-sm text-gray-700",
+		children: [
+			M ? /* @__PURE__ */ e("span", {
+				className: "font-medium",
+				children: M
+			}) : null,
+			E && !D ? /* @__PURE__ */ e("span", {
+				className: "font-medium",
+				children: U()
+			}) : null,
+			L && k && !D ? /* @__PURE__ */ t("span", {
+				className: "font-medium",
+				children: [
+					"Step ",
+					b,
+					" of ",
+					x
+				]
+			}) : null
+		]
+	}) : null, i[13] = b, i[14] = U, i[15] = L, i[16] = M, i[17] = D, i[18] = E, i[19] = k, i[20] = oe, i[21] = x, i[22] = G) : G = i[22];
+	let K;
+	i[23] !== T || i[24] !== V || i[25] !== j || i[26] !== A || i[27] !== N || i[28] !== ae || i[29] !== O ? (K = O && A != null ? /* @__PURE__ */ e("div", {
+		className: "relative h-2 sm:h-8",
+		children: /* @__PURE__ */ e("div", {
+			className: `absolute top-0 -translate-x-1/2 transform transition-all ease-out ${N}`.trim(),
+			style: {
+				left: `${V}%`,
+				transitionDuration: T ? `${j}ms` : "0ms"
+			},
+			children: /* @__PURE__ */ e("div", {
+				className: "text-lg",
+				children: ae
+			})
+		})
+	}) : null, i[23] = T, i[24] = V, i[25] = j, i[26] = A, i[27] = N, i[28] = ae, i[29] = O, i[30] = K) : K = i[30];
+	let ce = `relative w-full overflow-hidden ${C} mt-[14px] sm:mt-0 ${S}`, q;
+	i[31] === ce ? q = i[32] : (q = ce.trim(), i[31] = ce, i[32] = q);
+	let le = `relative overflow-hidden ${S} ${w} transition-all ease-out`, ue = `${V}%`, de = T ? `${j}ms` : "0ms", J;
+	i[33] !== ue || i[34] !== de ? (J = {
+		width: ue,
+		transitionDuration: de
+	}, i[33] = ue, i[34] = de, i[35] = J) : J = i[35];
+	let Y;
+	i[36] === Symbol.for("react.memo_cache_sentinel") ? (Y = /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 -skew-x-12 animate-shimmer bg-gradient-to-r from-transparent via-white/20 to-transparent" }), i[36] = Y) : Y = i[36];
+	let X;
+	i[37] !== le || i[38] !== J ? (X = /* @__PURE__ */ e("div", {
+		className: le,
+		style: J,
+		children: Y
+	}), i[37] = le, i[38] = J, i[39] = X) : X = i[39];
+	let Z;
+	i[40] !== q || i[41] !== X ? (Z = /* @__PURE__ */ e("div", {
+		className: q,
+		children: X
+	}), i[40] = q, i[41] = X, i[42] = Z) : Z = i[42];
+	let Q;
+	i[43] !== T || i[44] !== V || i[45] !== b || i[46] !== j || i[47] !== U || i[48] !== L || i[49] !== D || i[50] !== k || i[51] !== x ? (Q = D ? /* @__PURE__ */ e("div", {
+		className: "relative -mt-[8px] h-2 sm:h-8",
+		children: /* @__PURE__ */ e("div", {
+			className: "absolute top-0 -translate-x-1/2 transform transition-all ease-out",
+			style: {
+				left: `${V}%`,
+				transitionDuration: T ? `${j}ms` : "0ms"
+			},
+			children: /* @__PURE__ */ e("span", {
+				className: "text-lg font-bold text-primary/75",
+				children: L && k ? `${b}/${x}` : U()
+			})
+		})
+	}) : null, i[43] = T, i[44] = V, i[45] = b, i[46] = j, i[47] = U, i[48] = L, i[49] = D, i[50] = k, i[51] = x, i[52] = Q) : Q = i[52];
+	let $;
+	return i[53] !== W || i[54] !== G || i[55] !== K || i[56] !== Z || i[57] !== Q ? ($ = /* @__PURE__ */ t("div", {
+		className: W,
+		children: [
+			G,
+			K,
+			Z,
+			Q
+		]
+	}), i[53] = W, i[54] = G, i[55] = K, i[56] = Z, i[57] = Q, i[58] = $) : $ = i[58], $;
+}
+function i(te) {
+	let n = ee(40), { sqSize: r, strokeWidth: i, percentage: a, textClassName: o, className: s, trackClassName: c, progressClassName: l } = te, u = r === void 0 ? 60 : r, d = i === void 0 ? 5 : i, f = a === void 0 ? 0 : a, ne = o === void 0 ? "" : o, re = s === void 0 ? "" : s, p = c === void 0 ? "text-primary/25" : c, ie = l === void 0 ? "text-primary" : l, m = (u - d) / 2, h = 2 * Math.PI * m, g = h - h * f / 100, _ = Math.min(Math.max(f, 0), 100), v = `relative ${re}`, y;
+	n[0] === v ? y = n[1] : (y = v.trim(), n[0] = v, n[1] = y);
+	let b;
+	n[2] === u ? b = n[3] : (b = {
+		width: u,
+		height: u
+	}, n[2] = u, n[3] = b);
+	let x;
+	n[4] === _ ? x = n[5] : (x = Math.round(_), n[4] = _, n[5] = x);
+	let S = `0 0 ${u} ${u}`, C = u / 2, w = u / 2, T;
+	n[6] !== m || n[7] !== d || n[8] !== C || n[9] !== w || n[10] !== p ? (T = /* @__PURE__ */ e("circle", {
+		className: p,
+		strokeWidth: d,
+		stroke: "currentColor",
+		fill: "transparent",
+		r: m,
+		cx: C,
+		cy: w
+	}), n[6] = m, n[7] = d, n[8] = C, n[9] = w, n[10] = p, n[11] = T) : T = n[11];
+	let E = `transition-all duration-500 ease-in-out ${ie}`, D;
+	n[12] === E ? D = n[13] : (D = E.trim(), n[12] = E, n[13] = D);
+	let O = u / 2, k = u / 2, A;
+	n[14] !== h || n[15] !== m || n[16] !== g || n[17] !== d || n[18] !== D || n[19] !== O || n[20] !== k ? (A = /* @__PURE__ */ e("circle", {
+		className: D,
+		strokeWidth: d,
+		strokeLinecap: "round",
+		stroke: "currentColor",
+		fill: "transparent",
+		r: m,
+		cx: O,
+		cy: k,
+		strokeDasharray: h,
+		strokeDashoffset: g
+	}), n[14] = h, n[15] = m, n[16] = g, n[17] = d, n[18] = D, n[19] = O, n[20] = k, n[21] = A) : A = n[21];
+	let j;
+	n[22] !== u || n[23] !== S || n[24] !== T || n[25] !== A ? (j = /* @__PURE__ */ t("svg", {
+		className: "-rotate-90 transform",
+		width: u,
+		height: u,
+		viewBox: S,
+		"aria-hidden": !0,
+		children: [T, A]
+	}), n[22] = u, n[23] = S, n[24] = T, n[25] = A, n[26] = j) : j = n[26];
+	let M = `absolute inset-0 flex flex-col items-center justify-center text-sm font-semibold text-secondary ${ne}`, N;
+	n[27] === M ? N = n[28] : (N = M.trim(), n[27] = M, n[28] = N);
+	let P;
+	n[29] === _ ? P = n[30] : (P = Math.round(_), n[29] = _, n[30] = P);
+	let F;
+	n[31] !== N || n[32] !== P ? (F = /* @__PURE__ */ t("span", {
+		className: N,
+		children: [P, "%"]
+	}), n[31] = N, n[32] = P, n[33] = F) : F = n[33];
+	let I;
+	return n[34] !== b || n[35] !== x || n[36] !== j || n[37] !== F || n[38] !== y ? (I = /* @__PURE__ */ t("div", {
+		className: y,
+		style: b,
+		role: "progressbar",
+		"aria-valuenow": x,
+		"aria-valuemin": 0,
+		"aria-valuemax": 100,
+		children: [j, F]
+	}), n[34] = b, n[35] = x, n[36] = j, n[37] = F, n[38] = y, n[39] = I) : I = n[39], I;
+}
+//#endregion
+export { i as CircularProgressBar, r as ProgressBar };