@photoroom/ui 0.1.90 → 0.1.92

package/index.mjs

@@ -32376,11 +32376,11 @@ var XW = ({ checkerboard: e, cover: t, imageUrl: n, loading: r, bottomRightIcon:
 			})]
 		}),
 		/* @__PURE__ */ T("div", {
-			className: "heading-light-600 text-content-primary mb-4",
+			className: "component-semi-strong-800 text-content-primary mb-4",
 			children: e
 		}),
 		/* @__PURE__ */ T("div", {
-			className: "body-500 text-content-secondary grow",
+			className: "body-light-500 text-content-secondary grow",
 			children: i
 		}),
 		r && /* @__PURE__ */ T("div", {
@@ -51342,7 +51342,7 @@ function nme({ className: e, inProgressLabel: t, completedLabel: n, actionLabel:
 				"aria-hidden": l,
 				className: V(v7, {
 					"pointer-events-none -translate-y-4 opacity-0": l,
-					"translate-y-0 opacity-1": !l
+					"translate-y-0 opacity-100": !l
 				}),
 				children: [/* @__PURE__ */ T("span", {
 					className: y7,
@@ -51359,7 +51359,7 @@ function nme({ className: e, inProgressLabel: t, completedLabel: n, actionLabel:
 				"aria-hidden": !l,
 				className: V(v7, {
 					"pointer-events-none translate-y-4 opacity-0": !l,
-					"translate-y-0 opacity-1": l
+					"translate-y-0 opacity-100": l
 				}),
 				children: [
 					/* @__PURE__ */ T(M, { className: "-ml-1 h-5 w-5 shrink-0" }),
@@ -54691,32 +54691,35 @@ var sge = Object.assign(L9, {
 			})]
 		})]
 	})
-}), dge = ({ titleBlock: e, reviews: t, ctaLabel: n, ctaLink: r, ...i }) => /* @__PURE__ */ E("section", {
-	className: V("flex flex-col", "px-4", "gap-i400", "py-e500"),
-	...i,
-	children: [
-		e,
-		t && t.length > 0 && /* @__PURE__ */ T("ul", {
-			className: V("lg:max-w-5.5xl mx-auto max-w-sm sm:max-w-lg", "flex flex-col flex-wrap gap-6 lg:flex-row lg:justify-center"),
-			children: t
-		}),
-		n && r && /* @__PURE__ */ T(rr, {
-			variant: "primary",
-			className: "font-700 mx-auto",
-			size: "medium",
-			density: "spacious",
-			as: "a",
-			href: r.href,
-			rel: "noreferrer noopener",
-			...r.extraAttrs,
-			children: n
-		})
-	]
-}), fge = ({ title: e, content: t, image: n, name: r, occupation: i, ...a }) => /* @__PURE__ */ T("li", {
-	className: V("md:max-w-5.5xl sm:max-w-lg", "lg:flex lg:items-stretch lg:justify-center", "lg:w-[calc(100%/3-16px)]"),
+}), dge = ({ titleBlock: e, reviews: t, ctaLabel: n, ctaLink: r, className: i, ...a }) => /* @__PURE__ */ T("section", {
+	className: H("pt-e700 pb-e1000 px-4 sm:px-6 md:px-8 xl:px-10", i),
 	...a,
+	children: /* @__PURE__ */ E("div", {
+		className: "gap-i600 mx-auto flex w-full max-w-[1200px] flex-col",
+		children: [
+			e,
+			t && t.length > 0 && /* @__PURE__ */ T("ul", {
+				className: "grid gap-6 lg:grid-cols-3",
+				children: t
+			}),
+			n && /* @__PURE__ */ T(rr, {
+				className: "mx-auto lg:hidden",
+				variant: "primary",
+				size: "medium",
+				density: "spacious",
+				as: "a",
+				href: r?.href,
+				rel: "noreferrer noopener",
+				...r?.extraAttrs,
+				children: n
+			})
+		]
+	})
+}), fge = ({ title: e, content: t, image: n, name: r, occupation: i, density: a = "default", className: o, ...s }) => /* @__PURE__ */ T("li", {
+	className: H("flex", o),
+	...s,
 	children: /* @__PURE__ */ E("article", {
-		className: V("rounded-500 flex h-full w-full flex-col gap-6 bg-neutral-100", "p-5 sm:p-8"),
+		className: V("rounded-500 flex h-full w-full flex-col bg-neutral-100", a === "compact" ? "p-6" : "p-8"),
 		children: [
 			/* @__PURE__ */ T("ul", {
 				className: "flex gap-1",
@@ -54726,28 +54729,28 @@ var sge = Object.assign(L9, {
 				}, `star_${t}`))
 			}),
 			/* @__PURE__ */ T("h3", {
-				className: "heading-light-400 text-black",
+				className: V("component-600 max-w-[560px] text-black", a === "compact" ? "py-4" : "py-6"),
 				children: e
 			}),
 			/* @__PURE__ */ T("div", {
 				className: "flex-1",
 				children: /* @__PURE__ */ T("p", {
-					className: "body-500 text-content-secondary",
+					className: "body-light-500 text-content-secondary max-w-[560px]",
 					children: t
 				})
 			}),
 			/* @__PURE__ */ E("div", {
-				className: "flex gap-3",
+				className: "flex gap-3 pt-6",
 				children: [!!n && /* @__PURE__ */ T("div", {
 					className: "relative h-10 w-10 shrink-0",
 					children: n
 				}), /* @__PURE__ */ E("div", {
 					className: "flex flex-col",
-					children: [/* @__PURE__ */ T("strong", {
-						className: "body-semi-strong-500 text-black",
+					children: [/* @__PURE__ */ T("span", {
+						className: "component-500 text-black",
 						children: r
 					}), /* @__PURE__ */ T("p", {
-						className: "body-400 text-content-secondary",
+						className: "component-light-400 text-content-secondary",
 						children: i
 					})]
 				})]
@@ -55022,7 +55025,7 @@ var _ge = ({ titleBlock: e, content: t, ctaLabel: n, ctaLink: r, ...i }) => /* @
 		className: "mx-auto flex max-w-[1200px] flex-col gap-6 lg:flex-row lg:justify-center",
 		children: t
 	})]
-}), xge = "cursor-pointer rounded-200 outline-hidden focus-visible:ring focus-visible:ring-misc-focus-indicator text-content-accent hover:text-content-accent-hover active:text-content-accent-down focus-visible:text-content-accent-hover".split(" ").map((e) => `[&_a]:${e}`).join(" "), Sge = ({ type: e = "default", content: t, footer: n, className: r, ...i }) => {
+}), xge = "cursor-pointer rounded-200 outline-hidden focus-visible:ring focus-visible:ring-misc-focus-indicator text-content-accent hover:text-content-accent-hover active:text-content-accent-down focus-visible:text-content-accent-hover".split(" ").map((e) => `[&_a]:${e}`).join(" "), Sge = ({ density: e = "default", content: t, footer: n, className: r, ...i }) => {
 	let a = e === "compact";
 	return /* @__PURE__ */ E("div", {
 		...i,

package/package.json

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