@athbnb/ui 0.0.2 → 0.0.3

package/dist/ui/TimePicker.js

@@ -0,0 +1,231 @@
+import { c as e } from "react/compiler-runtime";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import * as r from "react";
+//#region src/ui/TimePicker.tsx
+function i(r) {
+	let i = e(4), { className: a } = r, o, s;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ t("circle", {
+		cx: "12",
+		cy: "12",
+		r: "10"
+	}), s = /* @__PURE__ */ t("path", { d: "M12 6v6l4 2" }), i[0] = o, i[1] = s) : (o = i[0], s = i[1]);
+	let c;
+	return i[2] === a ? c = i[3] : (c = /* @__PURE__ */ n("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: a,
+		"aria-hidden": !0,
+		children: [o, s]
+	}), i[2] = a, i[3] = c), c;
+}
+function a(r) {
+	let i = e(4), { className: a } = r, o, s;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ t("circle", {
+		cx: "12",
+		cy: "12",
+		r: "4"
+	}), s = /* @__PURE__ */ t("path", { d: "M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41" }), i[0] = o, i[1] = s) : (o = i[0], s = i[1]);
+	let c;
+	return i[2] === a ? c = i[3] : (c = /* @__PURE__ */ n("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: a,
+		"aria-hidden": !0,
+		children: [o, s]
+	}), i[2] = a, i[3] = c), c;
+}
+function o(n) {
+	let r = e(3), { className: i } = n, a;
+	r[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ t("path", { d: "M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z" }), r[0] = a) : a = r[0];
+	let o;
+	return r[1] === i ? o = r[2] : (o = /* @__PURE__ */ t("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: i,
+		"aria-hidden": !0,
+		children: a
+	}), r[1] = i, r[2] = o), o;
+}
+var s = Array.from({ length: 12 }, (e, t) => (t + 1).toString().padStart(2, "0")), c = Array.from({ length: 12 }, (e, t) => (t * 5).toString().padStart(2, "0"));
+function l(e) {
+	if (!e || !/^\d{1,2}:\d{2}$/.test(e.trim())) return {
+		hour12: "12",
+		minute: "00",
+		period: "AM"
+	};
+	let [t, n] = e.trim().split(":"), r = Math.min(23, Math.max(0, parseInt(t, 10))), i = n.padStart(2, "0").slice(0, 2), a = r % 12;
+	a === 0 && (a = 12);
+	let o = r >= 12 ? "PM" : "AM";
+	return {
+		hour12: a.toString().padStart(2, "0"),
+		minute: i,
+		period: o
+	};
+}
+function ee(e, t, n) {
+	let r = parseInt(e, 10);
+	(Number.isNaN(r) || r < 1 || r > 12) && (r = 12);
+	let i = r;
+	n === "PM" && i !== 12 ? i += 12 : n === "AM" && i === 12 && (i = 0);
+	let a = t.padStart(2, "0").slice(0, 2);
+	return `${i.toString().padStart(2, "0")}:${a}`;
+}
+function te(e) {
+	if (!e || !/^\d{1,2}:\d{2}$/.test(e.trim())) return "—";
+	let { hour12: t, minute: n, period: r } = l(e);
+	return `${parseInt(t, 10).toString().padStart(2, "0")}:${n} ${r}`;
+}
+function u(u) {
+	let d = e(43), { value: f, onChange: p, placeholder: m, variant: h, horizontalPosition: g, className: _, id: v } = u, y = m === void 0 ? "Select time" : m, b = h === void 0 ? "day" : h, x = g === void 0 ? "left" : g, S = _ === void 0 ? "" : _, [C, w] = r.useState(!1), T;
+	d[0] === f ? T = d[1] : (T = l(f), d[0] = f, d[1] = T);
+	let E = T, [D, O] = r.useState(E.hour12), [k, A] = r.useState(E.minute), [j, M] = r.useState(E.period), N = r.useRef(null), P, F;
+	d[2] === f ? (P = d[3], F = d[4]) : (P = () => {
+		let e = l(f);
+		O(e.hour12), A(e.minute), M(e.period);
+	}, F = [f], d[2] = f, d[3] = P, d[4] = F), r.useEffect(P, F);
+	let I, L;
+	d[5] === Symbol.for("react.memo_cache_sentinel") ? (I = () => {
+		let e = (e) => {
+			let t = N.current, n = e.target;
+			t && n instanceof Node && !t.contains(n) && w(!1);
+		};
+		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, L = [], d[5] = I, d[6] = L) : (I = d[5], L = d[6]), r.useEffect(I, L);
+	let R;
+	d[7] !== p || d[8] !== D || d[9] !== k || d[10] !== j ? (R = () => {
+		let e = ee(D, k, j);
+		p?.(e), w(!1);
+	}, d[7] = p, d[8] = D, d[9] = k, d[10] = j, d[11] = R) : R = d[11];
+	let z = R, B;
+	d[12] === f ? B = d[13] : (B = f && /^\d{1,2}:\d{2}$/.test(f.trim()), d[12] = f, d[13] = B);
+	let V = !!B, H;
+	d[14] !== V || d[15] !== y || d[16] !== f ? (H = V ? te(f) : y, d[14] = V, d[15] = y, d[16] = f, d[17] = H) : H = d[17];
+	let U = H, W = `relative ${S}`, G;
+	d[18] === W ? G = d[19] : (G = W.trim(), d[18] = W, d[19] = G);
+	let K;
+	d[20] === Symbol.for("react.memo_cache_sentinel") ? (K = () => w(ne), d[20] = K) : K = d[20];
+	let q;
+	d[21] === Symbol.for("react.memo_cache_sentinel") ? (q = /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(i, { className: "h-3 w-3 sm:h-5 sm:w-5" }) }), d[21] = q) : q = d[21];
+	let J = `text-xs font-semibold sm:text-lg ${V ? "text-gray-600" : "text-gray-400"}`, Y;
+	d[22] !== J || d[23] !== U ? (Y = /* @__PURE__ */ t("div", {
+		className: "flex min-w-0 flex-1 items-center gap-1",
+		children: /* @__PURE__ */ t("span", {
+			className: J,
+			children: U
+		})
+	}), d[22] = J, d[23] = U, d[24] = Y) : Y = d[24];
+	let X;
+	d[25] === b ? X = d[26] : (X = /* @__PURE__ */ t("div", {
+		className: "shrink-0 text-gray-400",
+		children: b === "night" ? /* @__PURE__ */ t(o, { className: "h-3 w-3 sm:h-4 sm:w-4" }) : /* @__PURE__ */ t(a, { className: "h-3 w-3 sm:h-5 sm:w-5" })
+	}), d[25] = b, d[26] = X);
+	let Z;
+	d[27] !== v || d[28] !== C || d[29] !== Y || d[30] !== X ? (Z = /* @__PURE__ */ n("button", {
+		id: v,
+		type: "button",
+		"aria-haspopup": "dialog",
+		"aria-expanded": C,
+		onClick: K,
+		className: "flex w-full min-w-0 items-center gap-1 rounded-lg border border-primary/50 bg-gray-50 px-1 py-2 transition-colors hover:bg-gray-100 focus:border-transparent focus:outline-none focus:ring-1 focus:ring-primary sm:px-3 sm:py-2",
+		children: [
+			q,
+			Y,
+			X
+		]
+	}), d[27] = v, d[28] = C, d[29] = Y, d[30] = X, d[31] = Z) : Z = d[31];
+	let Q;
+	d[32] !== z || d[33] !== x || d[34] !== C || d[35] !== D || d[36] !== k || d[37] !== j ? (Q = C ? /* @__PURE__ */ n("div", {
+		role: "dialog",
+		"aria-label": "Choose time",
+		className: `absolute top-full z-20 mt-2 min-w-[200px] rounded-lg bg-white p-4 text-secondary shadow-primary ${x === "left" ? "left-0" : "right-0"}`,
+		children: [/* @__PURE__ */ n("div", {
+			className: "mb-4 flex gap-4",
+			children: [
+				/* @__PURE__ */ n("div", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ t("div", {
+						className: "mb-2 text-center text-sm",
+						children: "Hour"
+					}), /* @__PURE__ */ t("div", {
+						className: "max-h-32 space-y-1 overflow-y-auto",
+						children: s.map((e) => /* @__PURE__ */ t("button", {
+							type: "button",
+							onClick: () => O(e),
+							className: `w-full rounded px-2 py-1 text-sm ${D === e ? "bg-primary text-white" : "hover:bg-primary/20"}`,
+							children: e
+						}, e))
+					})]
+				}),
+				/* @__PURE__ */ n("div", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ t("div", {
+						className: "mb-2 text-center text-sm",
+						children: "Min"
+					}), /* @__PURE__ */ t("div", {
+						className: "max-h-32 space-y-1 overflow-y-auto",
+						children: c.map((e) => /* @__PURE__ */ t("button", {
+							type: "button",
+							onClick: () => A(e),
+							className: `w-full rounded px-2 py-1 text-sm ${k === e ? "bg-primary text-white" : "hover:bg-primary/20"}`,
+							children: e
+						}, e))
+					})]
+				}),
+				/* @__PURE__ */ n("div", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ t("div", {
+						className: "mb-2 text-center text-sm",
+						children: "Period"
+					}), /* @__PURE__ */ t("div", {
+						className: "space-y-1",
+						children: ["AM", "PM"].map((e) => /* @__PURE__ */ t("button", {
+							type: "button",
+							onClick: () => M(e),
+							className: `w-full rounded px-2 py-1 text-sm ${j === e ? "bg-primary text-white" : "hover:bg-primary/20"}`,
+							children: e
+						}, e))
+					})]
+				})
+			]
+		}), /* @__PURE__ */ n("div", {
+			className: "flex gap-2 border-t border-gray-600 pt-2",
+			children: [/* @__PURE__ */ t("button", {
+				type: "button",
+				onClick: () => w(!1),
+				className: "flex-1 cursor-pointer rounded px-3 py-2 text-sm transition-colors hover:bg-primary/20",
+				children: "CANCEL"
+			}), /* @__PURE__ */ t("button", {
+				type: "button",
+				onClick: z,
+				className: "flex-1 cursor-pointer rounded bg-primary px-3 py-2 text-sm text-white transition-colors",
+				children: "OK"
+			})]
+		})]
+	}) : null, d[32] = z, d[33] = x, d[34] = C, d[35] = D, d[36] = k, d[37] = j, d[38] = Q) : Q = d[38];
+	let $;
+	return d[39] !== G || d[40] !== Z || d[41] !== Q ? ($ = /* @__PURE__ */ n("div", {
+		className: G,
+		ref: N,
+		children: [Z, Q]
+	}), d[39] = G, d[40] = Z, d[41] = Q, d[42] = $) : $ = d[42], $;
+}
+function ne(e) {
+	return !e;
+}
+//#endregion
+export { u as TimePicker };

package/dist/ui/Toast.js

@@ -0,0 +1,18 @@
+/* empty css                                                */
+import { c as e } from "react/compiler-runtime";
+import { jsx as t } from "react/jsx-runtime";
+import { Bounce as n, Flip as r, Slide as i, ToastContainer as a, Zoom as o, toast as s } from "react-toastify";
+//#region src/ui/Toast.tsx
+var c = {
+	position: "top-right",
+	autoClose: 3e3
+};
+function l(n) {
+	let r = e(2), i;
+	return r[0] === n ? i = r[1] : (i = /* @__PURE__ */ t(a, {
+		...c,
+		...n
+	}), r[0] = n, r[1] = i), i;
+}
+//#endregion
+export { n as Bounce, r as Flip, i as Slide, l as ToastContainer, o as Zoom, s as toast };

package/dist/ui/Tooltip.js

@@ -0,0 +1,30 @@
+import { c as e } from "react/compiler-runtime";
+import { jsx as t } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import { Tooltip as r } from "react-tooltip";
+//#region src/ui/Tooltip.tsx
+var i = "!w-fit !text-xs text-black rounded-primary shadow-primary font-normal whitespace-break-spaces text-left", a = {
+	backgroundColor: "rgb(255, 255, 255)",
+	color: "#1b1b33",
+	borderRadius: "8px",
+	boxShadow: "0 2px 8px rgba(0, 0, 0, 0.1)"
+}, o = n(function(n, o) {
+	let s = e(13), c, l, u;
+	s[0] === n ? (c = s[1], l = s[2], u = s[3]) : ({className: c, style: u, ...l} = n, s[0] = n, s[1] = c, s[2] = l, s[3] = u);
+	let d;
+	s[4] === c ? d = s[5] : (d = [i, c].filter(Boolean), s[4] = c, s[5] = d);
+	let f = d.join(" "), p;
+	s[6] === u ? p = s[7] : (p = {
+		...a,
+		...u
+	}, s[6] = u, s[7] = p);
+	let m;
+	return s[8] !== o || s[9] !== l || s[10] !== f || s[11] !== p ? (m = /* @__PURE__ */ t(r, {
+		ref: o,
+		...l,
+		className: f,
+		style: p
+	}), s[8] = o, s[9] = l, s[10] = f, s[11] = p, s[12] = m) : m = s[12], m;
+});
+//#endregion
+export { o as Tooltip };

package/dist/utils/date-picker-utils.js

@@ -0,0 +1,81 @@
+//#region src/utils/date-picker-utils.ts
+var e = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
+], t = [
+	"Sun",
+	"Mon",
+	"Tue",
+	"Wed",
+	"Thu",
+	"Fri",
+	"Sat"
+];
+function n(e) {
+	return new Date(e.getFullYear(), e.getMonth(), e.getDate());
+}
+function r(t) {
+	return !t || isNaN(t.getTime()) ? "" : `${t.getDate().toString().padStart(2, "0")} ${e[t.getMonth()].slice(0, 3)} ${t.getFullYear()}`;
+}
+function i(e) {
+	return `${e.getFullYear()}-${(e.getMonth() + 1).toString().padStart(2, "0")}-${e.getDate().toString().padStart(2, "0")}`;
+}
+function a(t) {
+	if (t == null || !String(t).trim()) return null;
+	let r = String(t).trim();
+	if (/^\d{1,2}\/\d{1,2}\/\d{4}$/.test(r)) {
+		let [e, t, i] = r.split("/").map((e) => parseInt(e, 10)), a = new Date(i, t - 1, e);
+		return isNaN(a.getTime()) ? null : n(a);
+	}
+	let i = /^(\d{1,2})\s+([A-Za-z]{3})\s+(\d{4})$/.exec(r);
+	if (i) {
+		let t = parseInt(i[1], 10), r = i[2].toLowerCase(), a = parseInt(i[3], 10), o = e.findIndex((e) => e.slice(0, 3).toLowerCase() === r);
+		if (o >= 0) {
+			let e = new Date(a, o, t);
+			return isNaN(e.getTime()) ? null : n(e);
+		}
+	}
+	if (/^\d{4}-\d{2}-\d{2}/.test(r)) {
+		let [e, t, i] = r.slice(0, 10).split("-").map((e) => parseInt(e, 10)), a = new Date(e, t - 1, i);
+		return isNaN(a.getTime()) ? null : n(a);
+	}
+	let a = new Date(r);
+	return isNaN(a.getTime()) ? null : n(a);
+}
+function o(e) {
+	if (e == null) return null;
+	if (typeof e == "string" && /^\d{1,2}\/\d{1,2}\/\d{4}$/.test(e)) {
+		let [t, r, i] = e.split("/").map((e) => parseInt(e, 10));
+		return n(new Date(i, r - 1, t));
+	}
+	let t = typeof e == "string" ? new Date(e) : e;
+	return isNaN(t.getTime()) ? null : n(t);
+}
+function s(e, t) {
+	return !e || !t ? !1 : e.getDate() === t.getDate() && e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear();
+}
+function c(e, t) {
+	return n(e).getTime() - n(t).getTime();
+}
+function l(e, t, r) {
+	let i = n(e).getTime(), a = n(t).getTime(), o = n(r).getTime();
+	return i >= Math.min(a, o) && i <= Math.max(a, o);
+}
+function u(e, t) {
+	return new Date(e, t + 1, 0).getDate();
+}
+function d(e, t) {
+	return new Date(e, t, 1).getDay();
+}
+//#endregion
+export { e as MONTH_NAMES, t as WEEKDAYS, c as compareDay, r as formatDateDisplay, u as getDaysInMonth, d as getFirstWeekdayOfMonth, l as isDayBetweenInclusive, o as parseBoundaryDate, a as parseFlexibleDateInput, s as sameDay, n as startOfDay, i as toISODateString };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@athbnb/ui",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "type": "module",
   "sideEffects": false,
   "scripts": {
@@ -22,6 +22,30 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
     },
+    "./ui/*": {
+      "types": "./dist/ui/*.d.ts",
+      "import": "./dist/ui/*.js"
+    },
+    "./utils/*": {
+      "types": "./dist/utils/*.d.ts",
+      "import": "./dist/utils/*.js"
+    },
+    "./button": {
+      "types": "./dist/ui/Button.d.ts",
+      "import": "./dist/ui/Button.js"
+    },
+    "./toast": {
+      "types": "./dist/ui/Toast.d.ts",
+      "import": "./dist/ui/Toast.js"
+    },
+    "./tooltip": {
+      "types": "./dist/ui/Tooltip.d.ts",
+      "import": "./dist/ui/Tooltip.js"
+    },
+    "./google-map": {
+      "types": "./dist/ui/GoogleMap.d.ts",
+      "import": "./dist/ui/GoogleMap.js"
+    },
     "./theme.css": "./dist/theme.css",
     "./toastify.css": "./dist/ui.css"
   },