@solostylist/ui-kit 1.0.204 → 1.0.205

package/dist/s-comment-message-DDAHdQqY.js

@@ -0,0 +1,195 @@
+import { t as e } from "./createSvgIcon-KjKEsKNV.js";
+import { t } from "./ExpandMore-BTC1yHzp.js";
+import { t as n } from "./Favorite-mcH9KX-m.js";
+import { SAvatar as r } from "./s-avatar/s-avatar.js";
+import { i } from "./utils-Cu16ybRR.js";
+import { SSkeleton as a } from "./s-skeleton/s-skeleton.js";
+import { useEffect as o, useId as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Box as d, Button as f, Collapse as p, IconButton as m, Stack as h, Typography as g } from "@mui/material";
+//#region ../../node_modules/@mui/icons-material/esm/ExpandLess.js
+var _ = e(/* @__PURE__ */ l("path", { d: "m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z" }), "ExpandLess"), v = e(/* @__PURE__ */ l("path", { d: "M16.5 3c-1.74 0-3.41.81-4.5 2.09C10.91 3.81 9.24 3 7.5 3 4.42 3 2 5.42 2 8.5c0 3.78 3.4 6.86 8.55 11.54L12 21.35l1.45-1.32C18.6 15.36 22 12.28 22 8.5 22 5.42 19.58 3 16.5 3m-4.4 15.55-.1.1-.1-.1C7.14 14.24 4 11.39 4 8.5 4 6.5 5.5 5 7.5 5c1.54 0 3.04.99 3.57 2.36h1.87C13.46 5.99 14.96 5 16.5 5c2 0 3.5 1.5 3.5 3.5 0 2.89-3.14 5.74-7.9 10.05" }), "FavoriteBorder"), y = e(/* @__PURE__ */ l("path", { d: "M10 9V5l-7 7 7 7v-4.1c5 0 8.5 1.6 11 5.1-1-5-4-10-11-11" }), "Reply"), b = ({ id: e, userName: x, userAvatar: S, commentContent: C, datetime: w, likes: T = 0, isLiked: E = !1, replies: D = [], totalReplies: O, onLike: k, onReply: A, onToggleReplies: j, showReplies: M = !0, avatarSize: N = 48, level: P = 0, maxLevel: F = 3, loading: I = !1, children: L, sx: R = {} }) => {
+	let z = s(), B = e ?? z, [V, H] = c(T), [U, W] = c(E), [G, K] = c(!1), q = () => {
+		U ? (H((e) => Math.max(0, e - 1)), W(!1)) : (H((e) => e + 1), W(!0)), k && k(B);
+	}, J = () => {
+		A && A(B);
+	}, Y = () => {
+		K(!G), j && j(B);
+	}, X = i(w), Z = O ?? D.length, Q = Z > 0, $ = Math.min(P, F) * 2;
+	return o(() => {
+		H(T);
+	}, [T]), o(() => {
+		W(E);
+	}, [E]), I ? /* @__PURE__ */ l(d, {
+		sx: {
+			pl: $,
+			py: 1,
+			...R
+		},
+		children: /* @__PURE__ */ u(h, {
+			direction: "row",
+			spacing: 2,
+			alignItems: "flex-start",
+			children: [/* @__PURE__ */ l(a, {
+				component: "rounded-avatar",
+				width: N,
+				height: N
+			}), /* @__PURE__ */ u(d, {
+				sx: { flex: 1 },
+				children: [
+					/* @__PURE__ */ u(h, {
+						direction: "row",
+						alignItems: "center",
+						spacing: 2,
+						mb: 1,
+						children: [/* @__PURE__ */ l(a, {
+							variant: "text",
+							width: 120,
+							height: 20
+						}), /* @__PURE__ */ l(a, {
+							variant: "text",
+							width: 80,
+							height: 16
+						})]
+					}),
+					/* @__PURE__ */ l(a, {
+						variant: "text",
+						width: "100%",
+						height: 16,
+						sx: { mb: .5 }
+					}),
+					/* @__PURE__ */ l(a, {
+						variant: "text",
+						width: "85%",
+						height: 16,
+						sx: { mb: .5 }
+					}),
+					/* @__PURE__ */ l(a, {
+						variant: "text",
+						width: "70%",
+						height: 16,
+						sx: { mb: 2 }
+					}),
+					/* @__PURE__ */ u(h, {
+						direction: "row",
+						spacing: 1,
+						alignItems: "center",
+						children: [
+							/* @__PURE__ */ l(a, { component: "icon-button" }),
+							/* @__PURE__ */ l(a, {
+								variant: "text",
+								width: 20,
+								height: 16
+							}),
+							/* @__PURE__ */ l(a, {
+								variant: "text",
+								width: 60,
+								height: 32
+							}),
+							/* @__PURE__ */ l(a, {
+								variant: "text",
+								width: 80,
+								height: 32
+							})
+						]
+					})
+				]
+			})]
+		})
+	}) : /* @__PURE__ */ u(d, {
+		sx: {
+			pl: $,
+			py: 1,
+			...R
+		},
+		children: [/* @__PURE__ */ u(h, {
+			direction: "row",
+			spacing: 2,
+			alignItems: "flex-start",
+			children: [/* @__PURE__ */ l(r, {
+				avatar: S,
+				name: x,
+				size: N
+			}), /* @__PURE__ */ u(d, {
+				sx: { flex: 1 },
+				children: [
+					/* @__PURE__ */ u(h, {
+						direction: "row",
+						alignItems: "center",
+						spacing: 2,
+						mb: 1,
+						children: [/* @__PURE__ */ l(g, {
+							variant: "subtitle2",
+							fontWeight: "600",
+							children: x
+						}), /* @__PURE__ */ l("div", { children: /* @__PURE__ */ l(g, {
+							variant: "caption",
+							children: X
+						}) })]
+					}),
+					/* @__PURE__ */ l(g, {
+						variant: "body2",
+						sx: {
+							mb: 2,
+							lineHeight: 1.6
+						},
+						children: C
+					}),
+					/* @__PURE__ */ u(h, {
+						direction: "row",
+						spacing: 1,
+						alignItems: "center",
+						children: [
+							/* @__PURE__ */ l(m, {
+								onClick: q,
+								sx: { color: U ? "error.main" : "text.secondary" },
+								children: l(U ? n : v, {})
+							}),
+							V > 0 && /* @__PURE__ */ l(g, {
+								variant: "caption",
+								children: V
+							}),
+							/* @__PURE__ */ l(f, {
+								startIcon: /* @__PURE__ */ l(y, {}),
+								onClick: J,
+								variant: "text",
+								children: "Reply"
+							}),
+							Q && M && /* @__PURE__ */ u(f, {
+								startIcon: l(G ? _ : t, {}),
+								onClick: Y,
+								variant: "text",
+								children: [
+									Z,
+									" ",
+									Z === 1 ? "reply" : "replies"
+								]
+							})
+						]
+					}),
+					L && /* @__PURE__ */ l(d, {
+						sx: { mt: 2 },
+						children: L
+					})
+				]
+			})]
+		}), Q && M && /* @__PURE__ */ l(p, {
+			in: G,
+			children: /* @__PURE__ */ l(d, {
+				sx: { mt: 2 },
+				children: D.map((e, t) => /* @__PURE__ */ l(b, {
+					...e,
+					level: P + 1,
+					maxLevel: F,
+					onLike: k,
+					onReply: A,
+					showReplies: M,
+					avatarSize: Math.max(32, N - 8)
+				}, e.id ?? `reply-${t}`))
+			})
+		})]
+	});
+};
+b.displayName = "SCommentMessage";
+//#endregion
+export { b as t };

package/dist/s-copyable-text/index.js

@@ -1,4 +1,3 @@
-import "../createTheme-CMuiGmV-.js";
-import "../jsx-runtime-V-UOMaX1.js";
+import "../createTheme-DuS5_nJb.js";
 import { SCopyableText as e } from "./s-copyable-text.js";
 export { e as default };

package/dist/s-copyable-text/s-copyable-text.js

@@ -1,47 +1,47 @@
-import "../createTheme-CMuiGmV-.js";
-import { t as e } from "../jsx-runtime-V-UOMaX1.js";
-import { n as t, t as n } from "../ContentCopy-D1OlBB-D.js";
-import { useState as r } from "react";
-import { Box as i, IconButton as a, Paper as o, Typography as s } from "@mui/material";
+import "../createTheme-DuS5_nJb.js";
+import { n as e, t } from "../ContentCopy-DHDP4d6g.js";
+import { useState as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { Box as a, IconButton as o, Paper as s, Typography as c } from "@mui/material";
 //#region lib/s-copyable-text/s-copyable-text.tsx
-var c = e(), l = ({ text: e, typographyProps: l, onCopied: u, paperProps: d }) => {
-	let [f, p] = r(!1), m = async () => {
-		if (e) try {
-			await navigator.clipboard.writeText(e), p(!0), setTimeout(() => p(!1), 2e3), u?.();
+var l = ({ text: l, typographyProps: u, onCopied: d, paperProps: f }) => {
+	let [p, m] = n(!1), h = async () => {
+		if (l) try {
+			await navigator.clipboard.writeText(l), m(!0), setTimeout(() => m(!1), 2e3), d?.();
 		} catch (e) {
 			console.error("Failed to copy text:", e);
 		}
 	};
-	return e ? /* @__PURE__ */ (0, c.jsx)(o, {
+	return l ? /* @__PURE__ */ r(s, {
 		sx: {
 			p: 2,
 			border: "1px dashed",
 			borderColor: "divider"
 		},
-		...d,
-		children: /* @__PURE__ */ (0, c.jsxs)(i, {
+		...f,
+		children: /* @__PURE__ */ i(a, {
 			sx: { position: "relative" },
-			children: [/* @__PURE__ */ (0, c.jsx)(a, {
-				onClick: m,
+			children: [/* @__PURE__ */ r(o, {
+				onClick: h,
 				sx: {
 					position: "absolute",
 					top: "50%",
 					transform: "translateY(-50%)",
 					right: 0,
 					zIndex: 1,
-					color: f ? "success.main" : "inherit"
+					color: p ? "success.main" : "inherit"
 				},
-				children: f ? /* @__PURE__ */ (0, c.jsx)(t, {}) : /* @__PURE__ */ (0, c.jsx)(n, {})
-			}), /* @__PURE__ */ (0, c.jsx)(s, {
+				children: r(p ? e : t, {})
+			}), /* @__PURE__ */ r(c, {
 				variant: "body1",
 				sx: {
 					whiteSpace: "pre-wrap",
 					wordBreak: "break-word",
-					...l?.sx
+					...u?.sx
 				},
 				color: "text.secondary",
-				...l,
-				children: e
+				...u,
+				children: l
 			})]
 		})
 	}) : null;

package/dist/s-countdown/index.js

@@ -1,5 +1,4 @@
-import "../createTheme-CMuiGmV-.js";
-import "../jsx-runtime-V-UOMaX1.js";
+import "../createTheme-DuS5_nJb.js";
 import { SCountBox as e } from "./s-count-box.js";
 import { SCountdown as t } from "./s-count-down.js";
 export { e as SCountBox, t as SCountdown };

package/dist/s-countdown/s-count-box.js

@@ -1,13 +1,13 @@
-import "../createTheme-CMuiGmV-.js";
-import { t as e } from "../jsx-runtime-V-UOMaX1.js";
-import { SFlexBox as t } from "../s-flex-box/s-flex-box.js";
+import "../createTheme-DuS5_nJb.js";
+import { SFlexBox as e } from "../s-flex-box/s-flex-box.js";
 import "react";
-import { Fade as n, Slide as r, Typography as i } from "@mui/material";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { Fade as r, Slide as i, Typography as a } from "@mui/material";
 //#region lib/s-countdown/s-count-box.tsx
-var a = e(), o = ({ digit: e = 0, title: o = "", size: s = "medium", color: c = "inherit", animation: l = "none", sx: u, digitSx: d, titleSx: f, showSeparator: p = !1, separator: m = ":", digitFormat: h = "default", hidden: g = !1 }) => {
-	if (g) return null;
-	let _ = (e) => h === "padded" ? e.toString().padStart(2, "0") : e.toString(), v = (() => {
-		switch (s) {
+var o = ({ digit: o = 0, title: s = "", size: c = "medium", color: l = "inherit", animation: u = "none", sx: d, digitSx: f, titleSx: p, showSeparator: m = !1, separator: h = ":", digitFormat: g = "default", hidden: _ = !1 }) => {
+	if (_) return null;
+	let v = (e) => g === "padded" ? e.toString().padStart(2, "0") : e.toString(), y = (() => {
+		switch (c) {
 			case "small": return {
 				digit: {
 					fontSize: "1.5rem",
@@ -39,18 +39,18 @@ var a = e(), o = ({ digit: e = 0, title: o = "", size: s = "medium", color: c =
 				}
 			};
 		}
-	})(), y = _(e), b = /* @__PURE__ */ (0, a.jsx)(i, {
+	})(), b = v(o), x = /* @__PURE__ */ t(a, {
 		variant: "h3",
 		component: "span",
 		sx: {
 			fontWeight: 700,
-			color: c === "inherit" ? "text.primary" : `${c}.main`,
+			color: l === "inherit" ? "text.primary" : `${l}.main`,
 			width: "70px",
-			...v.digit,
-			...d
+			...y.digit,
+			...f
 		},
-		children: y
-	}), x = /* @__PURE__ */ (0, a.jsx)(i, {
+		children: b
+	}), S = /* @__PURE__ */ t(a, {
 		component: "span",
 		sx: {
 			color: "text.secondary",
@@ -58,45 +58,45 @@ var a = e(), o = ({ digit: e = 0, title: o = "", size: s = "medium", color: c =
 			textTransform: "uppercase",
 			display: "block",
 			mt: .5,
-			...v.title,
-			...f
+			...y.title,
+			...p
 		},
-		children: o
-	}), S = b;
-	l === "fade" ? S = /* @__PURE__ */ (0, a.jsx)(n, {
+		children: s
+	}), C = x;
+	u === "fade" ? C = /* @__PURE__ */ t(r, {
 		in: !0,
 		timeout: 300,
-		children: /* @__PURE__ */ (0, a.jsx)("div", { children: b })
-	}, y) : l === "slide" && (S = /* @__PURE__ */ (0, a.jsx)(r, {
+		children: /* @__PURE__ */ t("div", { children: x })
+	}, b) : u === "slide" && (C = /* @__PURE__ */ t(i, {
 		in: !0,
 		direction: "up",
 		timeout: 300,
-		children: /* @__PURE__ */ (0, a.jsx)("div", { children: b })
-	}, y));
-	let C = /* @__PURE__ */ (0, a.jsxs)(t, {
+		children: /* @__PURE__ */ t("div", { children: x })
+	}, b));
+	let w = /* @__PURE__ */ n(e, {
 		flexDirection: "column",
 		alignItems: "center",
 		sx: {
 			textAlign: "center",
 			minWidth: "fit-content",
-			...u
+			...d
 		},
-		children: [S, x]
+		children: [C, S]
 	});
-	return p ? /* @__PURE__ */ (0, a.jsxs)(t, {
+	return m ? /* @__PURE__ */ n(e, {
 		alignItems: "center",
-		children: [C, /* @__PURE__ */ (0, a.jsx)(i, {
+		children: [w, /* @__PURE__ */ t(a, {
 			variant: "h3",
 			sx: {
 				color: "text.secondary",
-				...v.digit,
+				...y.digit,
 				lineHeight: 1,
 				alignSelf: "flex-start",
 				mt: .5
 			},
-			children: m
+			children: h
 		})]
-	}) : C;
+	}) : w;
 };
 o.displayName = "SCountBox";
 //#endregion

package/dist/s-countdown/s-count-down.js

@@ -1,12 +1,12 @@
-import "../createTheme-CMuiGmV-.js";
-import { t as e } from "../jsx-runtime-V-UOMaX1.js";
-import { SFlexBox as t } from "../s-flex-box/s-flex-box.js";
-import n from "../hooks/use-count-down.js";
-import { SCountBox as r } from "./s-count-box.js";
+import "../createTheme-DuS5_nJb.js";
+import { SFlexBox as e } from "../s-flex-box/s-flex-box.js";
+import t from "../hooks/use-count-down.js";
+import { SCountBox as n } from "./s-count-box.js";
 import "react";
+import { jsx as r } from "react/jsx-runtime";
 import { Typography as i, useMediaQuery as a, useTheme as o } from "@mui/material";
 //#region lib/s-countdown/s-count-down.tsx
-var s = e(), c = ({ expireDate: e, size: c = "medium", color: l = "inherit", layout: u = "horizontal", animation: d = "none", showSeparators: f = !1, separator: p = ":", units: m = {
+var s = ({ expireDate: s, size: c = "medium", color: l = "inherit", layout: u = "horizontal", animation: d = "none", showSeparators: f = !1, separator: p = ":", units: m = {
 	days: !0,
 	hours: !0,
 	minutes: !0,
@@ -17,14 +17,14 @@ var s = e(), c = ({ expireDate: e, size: c = "medium", color: l = "inherit", lay
 	minutes: "MINS",
 	seconds: "SECS"
 }, digitFormat: g = "default", onComplete: _, onTick: v, onStart: y, completedText: b = "Time is up!", autoHideZeroUnits: x = !1, sx: S, "aria-label": C = "Countdown timer", paused: w = !1, responsive: T }) => {
-	let { timeLeft: E, isExpired: D } = n({
-		expireDate: e,
+	let { timeLeft: E, isExpired: D } = t({
+		expireDate: s,
 		onComplete: _,
 		onTick: v,
 		onStart: y,
 		paused: w
 	}), O = o(), k = a(O.breakpoints.only("xs")), A = a(O.breakpoints.only("sm")), j = a(O.breakpoints.only("md")), M = a(O.breakpoints.only("lg")), N = T ? k ? T.xs ?? c : A ? T.sm ?? c : j ? T.md ?? c : M ? T.lg ?? c : T.xl ?? c : c;
-	if (D && b) return /* @__PURE__ */ (0, s.jsx)(t, {
+	if (D && b) return /* @__PURE__ */ r(e, {
 		justifyContent: "center",
 		alignItems: "center",
 		sx: {
@@ -33,7 +33,7 @@ var s = e(), c = ({ expireDate: e, size: c = "medium", color: l = "inherit", lay
 		},
 		role: "timer",
 		"aria-label": `${C} - completed`,
-		children: typeof b == "string" ? /* @__PURE__ */ (0, s.jsx)(i, {
+		children: typeof b == "string" ? /* @__PURE__ */ r(i, {
 			variant: N === "large" ? "h4" : N === "small" ? "h6" : "h5",
 			color: l === "inherit" ? "text.primary" : `${l}.main`,
 			sx: { fontWeight: 600 },
@@ -61,7 +61,7 @@ var s = e(), c = ({ expireDate: e, size: c = "medium", color: l = "inherit", lay
 			value: E.seconds,
 			label: h.seconds
 		}
-	].filter((e) => m[e.key] && (!x || e.value > 0 || e.key === "seconds")), F = P.map((e, t) => /* @__PURE__ */ (0, s.jsx)(r, {
+	].filter((e) => m[e.key] && (!x || e.value > 0 || e.key === "seconds")), F = P.map((e, t) => /* @__PURE__ */ r(n, {
 		digit: e.value,
 		title: e.label ?? "",
 		size: N,
@@ -71,7 +71,7 @@ var s = e(), c = ({ expireDate: e, size: c = "medium", color: l = "inherit", lay
 		showSeparator: f && t < P.length - 1,
 		separator: p
 	}, e.key));
-	return /* @__PURE__ */ (0, s.jsx)(t, {
+	return /* @__PURE__ */ r(e, {
 		sx: [
 			{ width: "fit-content" },
 			u === "vertical" ? {
@@ -97,6 +97,6 @@ var s = e(), c = ({ expireDate: e, size: c = "medium", color: l = "inherit", lay
 		children: F
 	});
 };
-c.displayName = "SCountdown";
+s.displayName = "SCountdown";
 //#endregion
-export { c as SCountdown, c as default };
+export { s as SCountdown, s as default };

package/dist/s-data-table/index.js

@@ -1,4 +1,3 @@
-import "../createTheme-CMuiGmV-.js";
-import "../jsx-runtime-V-UOMaX1.js";
-import { t as e } from "../s-data-table-B9B189jk.js";
+import "../createTheme-DuS5_nJb.js";
+import { t as e } from "../s-data-table-BjqqIsFX.js";
 export { e as default };

package/dist/s-data-table/s-data-table.js

@@ -1,4 +1,3 @@
-import "../createTheme-CMuiGmV-.js";
-import "../jsx-runtime-V-UOMaX1.js";
-import { t as e } from "../s-data-table-B9B189jk.js";
+import "../createTheme-DuS5_nJb.js";
+import { t as e } from "../s-data-table-BjqqIsFX.js";
 export { e as SDataTable, e as default };