@photoroom/ui 0.1.173 → 0.1.175

package/index.mjs

@@ -36427,28 +36427,28 @@ var _Y = ({ color: e, onChange: t, label: n }) => {
 			})
 		]
 	});
-}, xY = ({ label: e, buttonLabel: t, className: n, color: r = "#FFFFFF", side: i = "bottom", align: a = "start", sideOffset: o, alignOffset: s, collisionPadding: c, onChange: l, onConfirm: u, selected: d }) => /* @__PURE__ */ E(JW, {
+}, xY = ({ label: e, buttonLabel: t, className: n, popoverClassName: r, color: i = "#FFFFFF", side: a = "bottom", align: o = "start", sideOffset: s, alignOffset: c, collisionPadding: l, onChange: u, onConfirm: d, selected: f }) => /* @__PURE__ */ E(JW, {
 	withBorder: !1,
-	side: i,
-	align: a,
-	sideOffset: o,
-	alignOffset: s,
-	collisionPadding: c,
-	className: "relative z-10 overflow-visible",
+	side: a,
+	align: o,
+	sideOffset: s,
+	alignOffset: c,
+	collisionPadding: l,
+	className: H("relative z-10 overflow-visible", r),
 	triggerElement: /* @__PURE__ */ E(Uq, {
 		"aria-label": e,
-		color: r,
+		color: i,
 		className: n,
-		selected: d
+		selected: f
 	}),
 	children: /* @__PURE__ */ E("div", {
 		className: "p-4",
 		children: /* @__PURE__ */ E(bY, {
 			inputLabel: e,
 			buttonLabel: t,
-			color: r,
-			onChange: l,
-			onConfirm: u,
+			color: i,
+			onChange: u,
+			onConfirm: d,
 			className: "w-[328px]"
 		})
 	})
@@ -54914,7 +54914,7 @@ var Wge = ({ titleBlock: e, children: t, ...n }) => /* @__PURE__ */ D("div", {
 		]
 	})
 }), t_e = ({ className: e, header: t, title: n, description: r, ...i }) => /* @__PURE__ */ D("div", {
-	className: H("bg-white-alpha-2 rounded-500 flex flex-col justify-between gap-6 overflow-clip p-6 sm:min-h-[288px]", e),
+	className: H("bg-white-alpha-2 rounded-500 flex flex-col justify-between gap-6 overflow-clip p-6 sm:min-h-[360px]", e),
 	...i,
 	children: [/* @__PURE__ */ E("div", {
 		className: "[&_img:h-full] [&_img:w-auto] [&_img:object-contain] h-18 w-full shrink-0",
@@ -54922,10 +54922,10 @@ var Wge = ({ titleBlock: e, children: t, ...n }) => /* @__PURE__ */ D("div", {
 	}), /* @__PURE__ */ D("div", {
 		className: "flex w-full flex-1 flex-col justify-end gap-4",
 		children: [/* @__PURE__ */ E("div", {
-			className: "component-light-700 text-content-white-primary",
+			className: "component-light-700 text-content-white-primary text-balance",
 			children: n
 		}), /* @__PURE__ */ E("div", {
-			className: "component-light-600 text-content-white-secondary",
+			className: "component-light-600 text-content-white-secondary text-pretty",
 			children: r
 		})]
 	})]
@@ -56933,7 +56933,7 @@ var Dve = ({ titleBlock: e, selectedIndex: t, background: n = "neutral-50-bottom
 	...n,
 	children: e
 }) : null, Ave = ({ titleBlock: e, background: t, children: r, className: i, ...a }) => {
-	let o = n.count(r);
+	let s = n.toArray(r), c = s.length;
 	return /* @__PURE__ */ E("section", {
 		className: H("pt-e700 pb-e1000 w-full px-4 sm:px-6 md:px-8 xl:px-10", {
 			"bg-surface-default": t === "white",
@@ -56944,30 +56944,33 @@ var Dve = ({ titleBlock: e, selectedIndex: t, background: n = "neutral-50-bottom
 			className: "gap-i600 mx-auto flex w-full max-w-[1200px] flex-col items-center",
 			children: [e, /* @__PURE__ */ E("div", {
 				className: V("grid w-full grid-cols-1 gap-6", {
-					"lg:grid-cols-2": o < 3,
-					"lg:grid-cols-3": o >= 3
+					"lg:grid-cols-3": c === 3,
+					"sm:grid-cols-2 xl:grid-cols-4": c !== 3
 				}),
-				children: r
+				children: s.map((e) => u(e) ? o(e, { cardCount: c }) : e)
 			})]
 		})
 	});
-}, jve = ({ icon: e, title: t, description: n, className: r, ...i }) => /* @__PURE__ */ D("div", {
-	className: H("flex flex-col gap-4 sm:flex-row sm:gap-6 lg:flex-col lg:gap-4", "border-t border-neutral-400", "pt-6 sm:pt-8", r),
-	...i,
-	children: [/* @__PURE__ */ E("div", {
-		className: "relative size-12 shrink-0",
-		children: e
-	}), /* @__PURE__ */ D("div", {
-		className: "flex flex-col gap-4",
-		children: [/* @__PURE__ */ E("h3", {
-			className: "component-700 text-content-primary max-w-[560px]",
-			children: t
-		}), /* @__PURE__ */ E("p", {
-			className: "body-light-600 text-content-secondary max-w-[560px]",
-			children: n
+}, jve = ({ icon: e, title: t, description: n, cardCount: r = 3, className: i, ...a }) => {
+	let o = r === 3;
+	return /* @__PURE__ */ D("div", {
+		className: H("rounded-500 border-misc-border flex flex-col gap-4 border p-6", o ? "sm:flex-row sm:gap-6 lg:min-h-[360px] lg:flex-col lg:gap-4" : "sm:min-h-[360px]", i),
+		...a,
+		children: [/* @__PURE__ */ E("div", {
+			className: "relative size-12 shrink-0",
+			children: e
+		}), /* @__PURE__ */ D("div", {
+			className: V("flex flex-col gap-4 sm:flex-1", o ? "lg:justify-end" : "sm:justify-end"),
+			children: [/* @__PURE__ */ E("h3", {
+				className: V("component-700 text-content-primary text-balance", o && "sm:max-w-[560px] lg:max-w-none"),
+				children: t
+			}), /* @__PURE__ */ E("p", {
+				className: V("body-light-600 text-content-secondary text-pretty", o && "sm:max-w-[560px] lg:max-w-none"),
+				children: n
+			})]
 		})]
-	})]
-}), Mve = /* @__PURE__ */ Xt(((e) => {
+	});
+}, Mve = /* @__PURE__ */ Xt(((e) => {
 	var t = typeof Symbol == "function" && Symbol.for, n = t ? Symbol.for("react.element") : 60103, r = t ? Symbol.for("react.portal") : 60106, i = t ? Symbol.for("react.fragment") : 60107, a = t ? Symbol.for("react.strict_mode") : 60108, o = t ? Symbol.for("react.profiler") : 60114, s = t ? Symbol.for("react.provider") : 60109, c = t ? Symbol.for("react.context") : 60110, l = t ? Symbol.for("react.async_mode") : 60111, u = t ? Symbol.for("react.concurrent_mode") : 60111, d = t ? Symbol.for("react.forward_ref") : 60112, f = t ? Symbol.for("react.suspense") : 60113, p = t ? Symbol.for("react.suspense_list") : 60120, m = t ? Symbol.for("react.memo") : 60115, h = t ? Symbol.for("react.lazy") : 60116, g = t ? Symbol.for("react.block") : 60121, _ = t ? Symbol.for("react.fundamental") : 60117, v = t ? Symbol.for("react.responder") : 60118, y = t ? Symbol.for("react.scope") : 60119;
 	function b(e) {
 		if (typeof e == "object" && e) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@photoroom/ui",
-  "version": "0.1.173",
+  "version": "0.1.175",
   "private": false,
   "description": "Photoroom design system components",
   "sideEffects": [