@solostylist/ui-kit 2.0.2 → 2.0.3

package/dist/s-product-gallery-Dj9eGg5i.js

@@ -1,430 +0,0 @@
-import { toSxArray as e } from "./utils/sx.js";
-import { resolveOwnerStateSlotProps as t } from "./utils/slots.js";
-import { t as n } from "./useForkRef-BuNFTXxE.js";
-import { t as r } from "./useEventCallback-DGCsaRIu.js";
-import { t as i } from "./appendOwnerState-CFQTq3pb.js";
-import { t as a } from "./createSvgIcon-3y-gS0r1.js";
-import { t as o } from "./useControlled-DqNPBJNp.js";
-import { t as s } from "./mergeSlotProps-DC8r4QzS.js";
-import { t as c } from "./s-carousel-CAyAl3ka.js";
-import { SLazyImage as l } from "./s-lazy-image/s-lazy-image.js";
-import { SIconButton as u } from "./s-icon-button/s-icon-button.js";
-import * as d from "react";
-import { createElement as ee } from "react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-import { Box as m, ButtonBase as h, CircularProgress as te, styled as g, useTheme as ne, useThemeProps as re } from "@mui/material";
-//#region ../../node_modules/@mui/icons-material/PlayArrowRounded.mjs
-var _ = a(/* @__PURE__ */ f("path", { d: "M8 6.82v10.36c0 .79.87 1.27 1.54.84l8.14-5.18c.62-.39.62-1.29 0-1.69L9.54 5.98C8.87 5.55 8 6.03 8 6.82" }), "PlayArrowRounded"), ie = g(m, {
-	name: "SProductGallery",
-	slot: "Root",
-	shouldForwardProp: (e) => e !== "ownerState"
-})({ width: "100%" }), ae = g(m, {
-	name: "SProductGallery",
-	slot: "Stage",
-	shouldForwardProp: (e) => e !== "ownerState"
-})(({ ownerState: e, theme: t }) => ({
-	aspectRatio: String(e.aspectRatio),
-	backgroundColor: (t.vars ?? t).palette.background.paper,
-	borderRadius: t.radius.md,
-	overflow: "hidden",
-	position: "relative",
-	width: "100%"
-})), oe = g(m, {
-	name: "SProductGallery",
-	slot: "Media",
-	shouldForwardProp: (e) => e !== "ownerState"
-})({
-	display: "grid",
-	height: "100%",
-	minWidth: 0,
-	position: "relative",
-	width: "100%",
-	"& > *": {
-		gridArea: "1 / 1",
-		minWidth: 0
-	}
-}), se = g(l, {
-	name: "SProductGallery",
-	slot: "Image",
-	shouldForwardProp: (e) => e !== "ownerState"
-})({}), ce = g(c, {
-	name: "SProductGallery",
-	slot: "Carousel",
-	shouldForwardProp: (e) => e !== "ownerState"
-})({}), le = g("video", {
-	name: "SProductGallery",
-	slot: "Video",
-	shouldForwardProp: (e) => e !== "ownerState"
-})({
-	display: "block",
-	height: "100%",
-	inset: 0,
-	maxHeight: "100%",
-	minHeight: 0,
-	objectFit: "cover",
-	position: "absolute",
-	width: "100%"
-}), ue = g(m, {
-	name: "SProductGallery",
-	slot: "VideoFrame"
-})({
-	height: "100%",
-	minHeight: 0,
-	position: "relative",
-	width: "100%"
-}), de = g(u, {
-	name: "SProductGallery",
-	slot: "VideoPlayButton"
-})(({ theme: e }) => {
-	let t = (e.vars ?? e).palette;
-	return {
-		height: e.spacing(7),
-		left: "50%",
-		position: "absolute",
-		top: "50%",
-		transform: "translate(-50%, -50%)",
-		width: e.spacing(7),
-		zIndex: 2,
-		"&.Mui-disabled": {
-			backgroundColor: t.blackAlpha.medium,
-			color: t.common.white
-		},
-		"& svg": { fontSize: e.typography.pxToRem(32) }
-	};
-}), fe = g(m, {
-	name: "SProductGallery",
-	slot: "Thumbnails",
-	shouldForwardProp: (e) => e !== "ownerState"
-})(({ theme: e }) => ({
-	marginTop: e.spacing(1),
-	width: "100%"
-})), pe = g(h, {
-	name: "SProductGallery",
-	slot: "Thumbnail",
-	shouldForwardProp: (e) => e !== "ownerState"
-})(({ theme: e }) => ({
-	backgroundColor: (e.vars ?? e).palette.background.paper,
-	boxSizing: "border-box",
-	borderRadius: e.radius.md,
-	display: "block",
-	height: e.spacing(7),
-	minHeight: e.spacing(5.5),
-	minWidth: e.spacing(5.5),
-	opacity: .72,
-	overflow: "hidden",
-	padding: 0,
-	position: "relative",
-	transition: e.transitions.create("opacity"),
-	marginInline: e.spacing(.5),
-	width: `calc(100% - ${e.spacing(1)})`,
-	[e.breakpoints.down("sm")]: { height: e.spacing(6.5) },
-	"&.Mui-focusVisible": {
-		outline: 0,
-		boxShadow: `0 0 0 2px ${(e.vars ?? e).palette.primary.main}`,
-		zIndex: 2
-	},
-	"&::after": {
-		border: "2px solid transparent",
-		borderRadius: "inherit",
-		content: "\"\"",
-		inset: 0,
-		pointerEvents: "none",
-		position: "absolute",
-		transition: e.transitions.create("border-color"),
-		zIndex: 1
-	},
-	"@media (hover: hover) and (pointer: fine)": { "&:hover": { opacity: 1 } },
-	"@media (prefers-reduced-motion: reduce)": {
-		transition: "none",
-		"&::after": { transition: "none" }
-	},
-	variants: [{
-		props: ({ ownerState: e }) => e.selected,
-		style: {
-			"&::after": { borderColor: (e.vars ?? e).palette.primary.main },
-			opacity: 1
-		}
-	}]
-})), me = g(m, {
-	name: "SProductGallery",
-	slot: "VideoIndicator"
-})(({ theme: e }) => {
-	let t = (e.vars ?? e).palette;
-	return {
-		alignItems: "center",
-		backgroundColor: e.alpha(t.common.black, .58),
-		borderRadius: e.radius.full,
-		boxShadow: e.shadows[2],
-		color: t.common.white,
-		display: "flex",
-		height: e.spacing(3.5),
-		justifyContent: "center",
-		left: "50%",
-		pointerEvents: "none",
-		position: "absolute",
-		top: "50%",
-		transform: "translate(-50%, -50%)",
-		width: e.spacing(3.5),
-		zIndex: 2,
-		"& svg": { fontSize: e.typography.pxToRem(20) }
-	};
-}), v = 1, he = 6;
-function ge(e, t) {
-	return e !== void 0 && Number.isFinite(e) && e > 0 ? e : t;
-}
-function _e(e, t) {
-	return typeof e == "number" ? ge(e, typeof t == "number" ? t : v) : typeof e == "string" && e.trim() ? e : t;
-}
-function ve(e) {
-	return e.type === "video" ? e.thumbnailSrc ?? e.poster ?? "" : e.thumbnailSrc ?? e.src;
-}
-function y(e) {
-	return e.type === "video" ? e.ariaLabel : e.alt;
-}
-function b(e) {
-	return e ? `${e.type ?? "image"}:${e.id}:${e.src}` : "";
-}
-var ye = (e, t, n) => {
-	let r = y(e);
-	return r ? `Show ${r}, ${t + 1} of ${n}` : `Show ${e.type === "video" ? "video" : "image"} ${t + 1} of ${n}`;
-};
-function be(e, t, n) {
-	return `${y(e) || (e.type === "video" ? "Product video" : "Product image")} ${t + 1} of ${n}`;
-}
-function xe(e, t) {
-	typeof e == "function" ? e(t) : e && (e.current = t);
-}
-var x = d.forwardRef(function(a, c) {
-	let { aspectRatio: u = v, defaultValue: m, getThumbnailAriaLabel: h = ye, items: g, onChange: y, slotProps: x, slots: S, sx: C, thumbnailsLabel: w = "Choose product media", thumbnailsToShow: Se = he, value: T, ...E } = re({
-		props: a,
-		name: "SProductGallery"
-	}), Ce = ne(), we = _e(u, v), D = Math.max(1, Math.floor(ge(Se, he))), Te = d.useRef(g[0]?.id ?? ""), Ee = d.useRef(m === void 0), [O, k] = o({
-		controlled: T,
-		default: m ?? Te.current,
-		name: "SProductGallery",
-		state: "value"
-	}), A = T !== void 0, j = g.findIndex((e) => e.id === O), De = !A && g.length > 0 && j < 0 && (O !== "" || Ee.current), M = j >= 0 ? j : De ? 0 : -1, N = g[M] ?? null, P = N?.id ?? "", Oe = b(N), F = N?.type === "video" ? Oe : "", I = d.useRef(null), L = d.useRef(null), R = d.useRef(!1), [ke, z] = d.useState({
-		mediaKey: "",
-		loading: !1,
-		started: !1
-	}), B = ke.mediaKey === F ? ke : null, V = B?.loading ?? !1, H = B?.started ?? !1, U = d.useId(), W = {
-		...E,
-		aspectRatio: we,
-		activeItem: N,
-		activeIndex: M,
-		defaultValue: m,
-		getThumbnailAriaLabel: h,
-		items: g,
-		onChange: y,
-		sx: C,
-		thumbnailsLabel: w,
-		thumbnailsToShow: D,
-		value: P
-	}, G = t(x?.video, W), Ae = n(L, G?.ref);
-	d.useEffect(() => {
-		!A && N && O !== P && k(P);
-	}, [
-		N,
-		P,
-		A,
-		k,
-		O
-	]), d.useEffect(() => {
-		M >= 0 && I.current?.scrollTo(M);
-	}, [M]), d.useEffect(() => {
-		R.current = !1;
-	}, [F]);
-	let je = r((e, t) => {
-		let n = g[t];
-		!n || n.id === N?.id || (k(n.id), y?.(e, n.id));
-	}), Me = r(() => {
-		let e = L.current;
-		if (!e || N?.type !== "video") return;
-		let t = b(N);
-		R.current = !0, z({
-			mediaKey: t,
-			loading: !0,
-			started: !1
-		}), e.play().catch(() => {
-			R.current = !1, z((n) => L.current === e && n.mediaKey === t ? {
-				...n,
-				loading: !1,
-				started: !1
-			} : n);
-		});
-	}), K = S?.root ?? ie, q = S?.stage ?? ae, Ne = S?.media ?? oe, Pe = S?.image ?? se, Fe = S?.video ?? le, J = S?.thumbnails ?? fe, Ie = S?.carousel ?? ce, Le = S?.thumbnail ?? pe, { ref: Re, sx: ze, ...Y } = i(K, s(t(x?.root, W), E), W), Be = n(Re, c), X = i(q, t(x?.stage, W) ?? {}, W), Ve = i(Ne, t(x?.media, W) ?? {}, W), Z = i(J, t(x?.thumbnails, W) ?? {}, W), He = t(x?.carousel, W), Q = Math.min(g.length, D), $ = He?.slotProps, Ue = i(Ie, s(He, {
-		arrows: g.length > Q,
-		slotProps: {
-			...$,
-			viewport: {
-				...$?.viewport,
-				sx: [{ py: .5 }, ...e($?.viewport?.sx)]
-			}
-		}
-	}), W), We = () => {
-		if (!N) return null;
-		if (N.type === "video") {
-			let e = b(N), t = (e) => e.currentTarget === L.current, { children: n, controls: r = !0, ...a } = i(Fe, s(G, {
-				controls: !0,
-				onCanPlay: (n) => {
-					t(n) && z((t) => t.mediaKey === e && t.started ? {
-						...t,
-						loading: !1
-					} : t);
-				},
-				onEnded: (n) => {
-					t(n) && (R.current = !1, z({
-						mediaKey: e,
-						loading: !1,
-						started: !1
-					}));
-				},
-				onError: (n) => {
-					t(n) && (R.current = !1, z({
-						mediaKey: e,
-						loading: !1,
-						started: !1
-					}));
-				},
-				onPause: (n) => {
-					t(n) && (R.current = !1, z({
-						mediaKey: e,
-						loading: !1,
-						started: !1
-					}));
-				},
-				onPlay: (n) => {
-					t(n) && z({
-						mediaKey: e,
-						loading: !0,
-						started: !1
-					});
-				},
-				onPlaying: (n) => {
-					if (!t(n)) return;
-					let r = n.currentTarget, i = R.current;
-					R.current = !1, z({
-						mediaKey: e,
-						loading: !1,
-						started: !0
-					}), i && requestAnimationFrame(() => {
-						L.current === r && r.focus({ preventScroll: !0 });
-					});
-				},
-				onWaiting: (n) => {
-					t(n) && z((t) => ({
-						mediaKey: e,
-						loading: !0,
-						started: t.mediaKey === e && t.started
-					}));
-				},
-				playsInline: !0,
-				preload: "metadata"
-			}), W);
-			return /* @__PURE__ */ p(ue, {
-				"aria-busy": V || void 0,
-				children: [/* @__PURE__ */ f(Fe, {
-					...a,
-					"aria-label": N.ariaLabel,
-					controls: r && H,
-					poster: N.poster,
-					ref: Ae,
-					src: N.src,
-					children: n
-				}), !H || V ? /* @__PURE__ */ f(de, {
-					"aria-busy": V || void 0,
-					"aria-label": V ? `Loading ${N.ariaLabel}` : `Play ${N.ariaLabel}`,
-					disabled: V,
-					onClick: Me,
-					variant: "overlay",
-					children: V ? /* @__PURE__ */ f(te, {
-						"aria-label": `Loading ${N.ariaLabel}`,
-						color: "inherit",
-						size: 28
-					}) : /* @__PURE__ */ f(_, {})
-				}) : null]
-			}, `${N.type}:${N.id}:${N.src}`);
-		}
-		let { slotProps: e, ...n } = s(t(x?.image, W), { variant: "rectangular" }), r = i(Pe, n, W), a = {
-			...e,
-			image: s(e?.image, { sx: { objectFit: "cover" } })
-		};
-		return /* @__PURE__ */ ee(Pe, {
-			...r,
-			alt: N.alt,
-			key: `${N.type ?? "image"}:${N.id}:${N.src}`,
-			slotProps: a,
-			src: N.src
-		});
-	};
-	return /* @__PURE__ */ p(K, {
-		...Y,
-		"aria-label": Y["aria-label"] ?? "Product media gallery",
-		"aria-roledescription": Y["aria-roledescription"] ?? "carousel",
-		ref: Be,
-		role: Y.role ?? "group",
-		sx: [...e(ze), ...e(C)],
-		children: [/* @__PURE__ */ f(q, {
-			...X,
-			"aria-hidden": X["aria-hidden"] ?? !N,
-			"aria-label": X["aria-label"] ?? (N ? be(N, M, g.length) : void 0),
-			"aria-roledescription": X["aria-roledescription"] ?? (N ? "slide" : void 0),
-			id: U,
-			role: X.role ?? (N ? "group" : void 0),
-			children: /* @__PURE__ */ f(Ne, {
-				...Ve,
-				children: We()
-			})
-		}), g.length > 1 ? /* @__PURE__ */ f(J, {
-			...Z,
-			"aria-label": Z["aria-label"] ?? w,
-			role: Z.role ?? "group",
-			children: /* @__PURE__ */ f(Ie, {
-				...Ue,
-				apiRef: I,
-				autoplay: !1,
-				centerMode: !1,
-				infinite: !1,
-				responsive: [{
-					breakpoint: Ce.breakpoints.values.sm,
-					settings: { slidesToShow: Math.max(Math.ceil(Q / 2), 1) }
-				}],
-				slidesToShow: Q,
-				spaceBetween: 0,
-				children: g.map((e, n) => {
-					let r = n === M, a = {
-						...W,
-						index: n,
-						item: e,
-						selected: r
-					}, o = t(x?.thumbnail, a), { ref: s, ...c } = i(Le, o ?? {}, a), u = `${U}-thumbnail-${n}`;
-					return /* @__PURE__ */ p(Le, {
-						...c,
-						"aria-controls": U,
-						"aria-label": h(e, n, g.length),
-						"aria-pressed": r,
-						id: u,
-						onClick: (e) => {
-							o?.onClick?.(e), e.defaultPrevented || je(e, n);
-						},
-						ref: (e) => {
-							xe(s, e);
-						},
-						children: [/* @__PURE__ */ f(l, {
-							alt: "",
-							src: ve(e),
-							variant: "rectangular",
-							slotProps: { image: { sx: { objectFit: "cover" } } }
-						}), e.type === "video" ? /* @__PURE__ */ f(me, {
-							"aria-hidden": !0,
-							children: /* @__PURE__ */ f(_, {})
-						}) : null]
-					}, e.id);
-				})
-			})
-		}) : null]
-	});
-});
-x.displayName = "SProductGallery";
-//#endregion
-export { x as t };

package/dist/s-review--Q2C0ngO.js

@@ -1,272 +0,0 @@
-import { i as e } from "./utils-DOY6v6ln.js";
-import { toSxArray as t } from "./utils/sx.js";
-import { t as n } from "./createSvgIcon-3y-gS0r1.js";
-import { t as r } from "./useControlled-DqNPBJNp.js";
-import { t as i } from "./s-image-viewer-CjK67-rs.js";
-import { SLazyImage as a } from "./s-lazy-image/s-lazy-image.js";
-import { SSkeleton as o } from "./s-skeleton/s-skeleton.js";
-import { SAvatar as s } from "./s-avatar/s-avatar.js";
-import { SRating as ee } from "./s-rating/s-rating.js";
-import c, { useId as l, useState as u } from "react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import { Box as p, ButtonBase as m, Divider as h, IconButton as g, Stack as _, Typography as v, styled as y, useTheme as b, useThemeProps as te } from "@mui/material";
-//#region ../../node_modules/@mui/icons-material/ThumbDown.mjs
-var ne = n(/* @__PURE__ */ d("path", { d: "M15 3H6c-.83 0-1.54.5-1.84 1.22l-3.02 7.05c-.09.23-.14.47-.14.73v2c0 1.1.9 2 2 2h6.31l-.95 4.57-.03.32c0 .41.17.79.44 1.06L9.83 23l6.59-6.59c.36-.36.58-.86.58-1.41V5c0-1.1-.9-2-2-2m4 0v12h4V3z" }), "ThumbDown"), x = n(/* @__PURE__ */ d("path", { d: "M1 21h4V9H1zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73z" }), "ThumbUp"), S = y(p, {
-	name: "SReview",
-	slot: "Root"
-})({}), C = c.forwardRef(function(n, c) {
-	let y = te({
-		props: n,
-		name: "SReview"
-	}), C = b(), { reviewId: re, userName: w, userAvatar: T, rating: E, onRatingChange: ie, reviewContent: ae, datetime: D, images: O, userHelpfulVote: k, defaultUserHelpfulVote: A = null, helpfulYes: j, defaultHelpfulYes: M = 0, helpfulNo: oe, defaultHelpfulNo: N = 0, onHelpfulVote: se, showHelpfulSection: P = !0, avatarSize: F = 48, maxRating: I = 5, readOnly: L = !0, showDivider: R = !0, loading: z = !1, sx: B, ...V } = y, H = l(), U = re ?? V.id ?? H, [W, G] = r({
-		controlled: k,
-		default: A,
-		name: "SReview",
-		state: "userHelpfulVote"
-	}), [K, ce] = r({
-		controlled: j,
-		default: M,
-		name: "SReview",
-		state: "helpfulYes"
-	}), [q, le] = r({
-		controlled: oe,
-		default: N,
-		name: "SReview",
-		state: "helpfulNo"
-	}), J = {
-		...y,
-		avatarSize: F,
-		defaultHelpfulNo: N,
-		defaultHelpfulYes: M,
-		defaultUserHelpfulVote: A,
-		helpfulNo: q,
-		helpfulYes: K,
-		maxRating: I,
-		loading: z,
-		readOnly: L,
-		reviewId: U,
-		showDivider: R,
-		showHelpfulSection: P,
-		userHelpfulVote: W
-	}, [ue, Y] = u(!1), [de, X] = u(null), Z = (e, t) => {
-		let n = W === t ? null : t, r = K, i = q;
-		W === "yes" && (r = Math.max(0, r - 1)), W === "no" && (i = Math.max(0, i - 1)), n === "yes" && (r += 1), n === "no" && (i += 1), G(n), ce(r), le(i), se?.(e, U, n);
-	}, Q = O?.map((e, t) => ({
-		id: `review-${U}-image-${t}`,
-		type: "image",
-		url: e,
-		title: `Review image ${t + 1}`,
-		desc: `Image ${t + 1} from ${w}'s review`
-	})) ?? [], fe = (e) => {
-		let t = Q[e];
-		t && (X(t), Y(!0));
-	}, $ = () => {
-		Y(!1), X(null);
-	}, pe = (e, t) => {
-		X(t);
-	}, me = e(D);
-	return z ? /* @__PURE__ */ f(S, {
-		...V,
-		ref: c,
-		ownerState: J,
-		sx: [{ py: 2 }, ...t(B)],
-		children: [/* @__PURE__ */ f(_, {
-			direction: "row",
-			spacing: 2,
-			sx: { alignItems: "flex-start" },
-			children: [/* @__PURE__ */ d(o, {
-				variant: "circular",
-				width: F,
-				height: F,
-				sx: { flexShrink: 0 }
-			}), /* @__PURE__ */ f(p, {
-				sx: { flex: 1 },
-				children: [
-					/* @__PURE__ */ f(_, {
-						direction: "row",
-						spacing: 2,
-						sx: {
-							alignItems: "center",
-							mb: 1
-						},
-						children: [/* @__PURE__ */ d(o, {
-							width: 120,
-							height: 20
-						}), /* @__PURE__ */ d(o, {
-							width: 80,
-							height: 16
-						})]
-					}),
-					/* @__PURE__ */ d(p, {
-						sx: { mb: 1 },
-						children: /* @__PURE__ */ d(o, {
-							width: 100,
-							height: 20
-						})
-					}),
-					/* @__PURE__ */ d(o, {
-						height: 16,
-						sx: { mb: .5 }
-					}),
-					P && /* @__PURE__ */ f(_, {
-						direction: "row",
-						spacing: 1,
-						sx: {
-							display: "inline-flex",
-							alignItems: "center"
-						},
-						children: [
-							/* @__PURE__ */ d(o, {
-								width: 140,
-								height: 16,
-								sx: { mr: 2 }
-							}),
-							/* @__PURE__ */ d(o, { preset: "icon-button" }),
-							/* @__PURE__ */ d(o, {
-								width: 20,
-								height: 16
-							}),
-							/* @__PURE__ */ d(o, { preset: "icon-button" }),
-							/* @__PURE__ */ d(o, {
-								width: 20,
-								height: 16
-							})
-						]
-					})
-				]
-			})]
-		}), R && /* @__PURE__ */ d(h, { sx: { mt: 2 } })]
-	}) : /* @__PURE__ */ f(S, {
-		...V,
-		ref: c,
-		ownerState: J,
-		sx: [{ py: 2 }, ...t(B)],
-		children: [
-			/* @__PURE__ */ f(_, {
-				direction: "row",
-				spacing: 2,
-				sx: { alignItems: "flex-start" },
-				children: [/* @__PURE__ */ d(s, {
-					src: T,
-					name: w,
-					size: F
-				}), /* @__PURE__ */ f(p, {
-					sx: { flex: 1 },
-					children: [
-						/* @__PURE__ */ d(v, {
-							variant: "subtitle1",
-							children: w
-						}),
-						/* @__PURE__ */ d(p, { children: /* @__PURE__ */ d(ee, {
-							value: E,
-							max: I,
-							onChange: ie,
-							readOnly: L
-						}) }),
-						/* @__PURE__ */ d(v, {
-							variant: "body1",
-							sx: { lineHeight: 1.6 },
-							children: ae
-						}),
-						/* @__PURE__ */ d(p, { children: /* @__PURE__ */ d(v, {
-							variant: "caption",
-							sx: { mb: 2 },
-							children: me
-						}) }),
-						O && O.length > 0 && /* @__PURE__ */ d(_, {
-							direction: "row",
-							sx: {
-								mt: 1,
-								mb: 2,
-								flexWrap: "wrap",
-								gap: 1
-							},
-							children: O.map((e, t) => /* @__PURE__ */ d(m, {
-								"aria-label": `Open review image ${t + 1}`,
-								component: "div",
-								onClick: () => fe(t),
-								sx: {
-									borderRadius: 1,
-									transition: (e) => e.transitions.create("opacity", { duration: e.transitions.duration.shorter }),
-									"&.Mui-focusVisible": {
-										outline: "2px solid",
-										outlineColor: "primary.main",
-										outlineOffset: 2
-									},
-									"@media (hover: hover) and (pointer: fine)": { "&:hover": { opacity: C.interaction.mediaHoverOpacity } }
-								},
-								children: /* @__PURE__ */ d(a, {
-									src: e,
-									alt: `Review image ${t + 1}`,
-									width: 80,
-									height: 80,
-									slotProps: { image: { sx: { objectFit: "cover" } } }
-								})
-							}, `${e}-${t}`))
-						}),
-						P && /* @__PURE__ */ f(_, {
-							direction: "row",
-							spacing: 1,
-							sx: {
-								display: "inline-flex",
-								alignItems: "center"
-							},
-							children: [
-								/* @__PURE__ */ d(v, {
-									variant: "body2",
-									sx: { mr: 2 },
-									children: "Was this review helpful?"
-								}),
-								/* @__PURE__ */ d(g, {
-									"aria-label": "Mark review as helpful",
-									"aria-pressed": W === "yes",
-									onClick: (e) => Z(e, "yes"),
-									sx: {
-										color: W === "yes" ? "primary.main" : "text.secondary",
-										"&:hover": { backgroundColor: "action.hover" }
-									},
-									children: /* @__PURE__ */ d(x, { fontSize: "small" })
-								}),
-								/* @__PURE__ */ d(v, {
-									variant: "caption",
-									children: K
-								}),
-								/* @__PURE__ */ d(g, {
-									"aria-label": "Mark review as not helpful",
-									"aria-pressed": W === "no",
-									onClick: (e) => Z(e, "no"),
-									sx: {
-										color: W === "no" ? "error.main" : "text.secondary",
-										ml: 1,
-										"&:hover": { backgroundColor: "action.hover" }
-									},
-									children: /* @__PURE__ */ d(ne, { fontSize: "small" })
-								}),
-								/* @__PURE__ */ d(v, {
-									variant: "caption",
-									children: q
-								})
-							]
-						})
-					]
-				})]
-			}),
-			R && /* @__PURE__ */ d(h, { sx: { mt: 2 } }),
-			/* @__PURE__ */ d(i, {
-				"aria-label": "Review media viewer",
-				open: ue,
-				onClose: $,
-				onCloseButtonClick: $,
-				selectedItem: de,
-				onItemChange: pe,
-				mediaItems: Q,
-				showNavigation: Q.length > 1,
-				showThumbnailDock: Q.length > 1,
-				showCounter: Q.length > 1
-			})
-		]
-	});
-});
-C.displayName = "SReview";
-//#endregion
-export { C as t };