@photoroom/ui 0.1.773 → 0.1.774

package/index.mjs

@@ -59221,35 +59221,34 @@ var wTe = ({ titleBlock: e, children: t, className: n, ...r }) => /* @__PURE__ *
 			className: "size-6 text-white"
 		})
 	});
-}, O7 = {}, k7 = ({ variant: e, className: t, cssBackgroundColor: n, children: r, isHiddenSessionKey: i, closeLabel: a, closeButtonVariant: o = "secondary-on-dark", forceShow: s, ...c }) => {
-	let [l, u] = Pe(() => i ? O7[i] ?? !0 : !1), d = !s && l;
+}, O7 = {}, k7 = ({ variant: e, className: t, children: n, isHiddenSessionKey: r, closeLabel: i, closeButtonVariant: a = "secondary-on-dark", forceShow: o, ...s }) => {
+	let [c, l] = Pe(() => r ? O7[r] ?? !0 : !1), u = !o && c;
 	De(() => {
-		if (!i) return;
+		if (!r) return;
 		let e;
 		try {
-			let t = sessionStorage.getItem(i);
+			let t = sessionStorage.getItem(r);
 			e = t ? !!JSON.parse(t) : !1;
 		} catch {
 			e = !1;
 		}
-		O7[i] = e, u(e);
-	}, [i]);
-	let f = V(() => {
-		s || (u(!0), i && (sessionStorage.setItem(i, JSON.stringify(!0)), O7[i] = !0));
-	}, [i, s]);
-	return d ? null : /* @__PURE__ */ R("div", {
-		className: U("relative text-white", "ps-4 pe-16 sm:ps-6 md:ps-8 lg:px-16", !n && e === "black" && "bg-black", !n && e === "neutral" && "bg-neutral-800", t),
-		style: n ? { backgroundColor: n } : void 0,
-		...c,
+		O7[r] = e, l(e);
+	}, [r]);
+	let d = V(() => {
+		o || (l(!0), r && (sessionStorage.setItem(r, JSON.stringify(!0)), O7[r] = !0));
+	}, [r, o]);
+	return u ? null : /* @__PURE__ */ R("div", {
+		className: U("relative text-white", "ps-4 pe-16 sm:ps-6 md:ps-8 lg:px-16", e === "dark" ? "bg-neutral-900" : "bg-neutral-800", t),
+		...s,
 		children: [/* @__PURE__ */ L("div", {
-			className: "mx-auto flex min-h-[64px] max-w-[1200px] items-center md:justify-center",
-			children: r
+			className: U("mx-auto flex max-w-[1200px] items-center lg:justify-center", e === "dark" ? "min-h-14" : "min-h-16"),
+			children: n
 		}), /* @__PURE__ */ L(sd, {
-			"aria-label": a || "Close",
-			className: "absolute end-5 top-5",
-			variant: o,
+			"aria-label": i || "Close",
+			className: U("absolute end-5", e === "dark" ? "top-4" : "top-5"),
+			variant: a,
 			size: "small",
-			onClick: f
+			onClick: d
 		})]
 	});
 }, kTe = ({ title: e, backgroundColor: t, bgImageDesktop: n, bgImageMobile: r, className: i, ...a }) => /* @__PURE__ */ R("div", {
@@ -60629,41 +60628,35 @@ var TEe = Object.assign(J7, {
 			}, e.id))
 		]
 	});
-}, Y7 = "is-promo-banner-hidden", jEe = ({ contextLabel: e, closeAriaLabel: t, cssBackgroundColor: n, thumbnail: r, cta: i, linkAs: a = "a", description: o, forceShow: s, ...c }) => /* @__PURE__ */ L(k7, {
-	variant: "black",
-	cssBackgroundColor: n,
+}, Y7 = "is-promo-banner-hidden", jEe = ({ contextLabel: e, closeAriaLabel: t, cta: n, linkAs: r = "a", description: i, forceShow: a, ...o }) => /* @__PURE__ */ L(k7, {
+	variant: "dark",
 	isHiddenSessionKey: Y7,
 	closeLabel: t,
 	closeButtonVariant: "borderless-on-dark",
-	forceShow: s,
-	...c,
+	forceShow: a,
+	...o,
 	children: /* @__PURE__ */ R("div", {
-		className: "flex flex-wrap items-center gap-x-4 gap-y-2 py-4",
-		children: [e && /* @__PURE__ */ L("div", {
-			className: "component-semi-strong-500 shrink-0",
-			children: e
-		}), /* @__PURE__ */ R("div", {
-			className: "flex flex-wrap items-center gap-x-4 gap-y-2",
-			children: [/* @__PURE__ */ R("div", {
-				className: "flex items-center gap-2",
-				children: [r && /* @__PURE__ */ L("div", {
-					className: "relative size-8 shrink-0 overflow-hidden rounded",
-					children: r
-				}), /* @__PURE__ */ L("span", {
-					className: "component-light-500 [&_a]:underline [&>p]:inline",
-					children: o
-				})]
-			}), i && /* @__PURE__ */ L(td, {
-				as: a,
-				href: i.href,
+		className: "flex flex-col items-start gap-3 py-4 lg:flex-row lg:items-center lg:gap-4 lg:py-3",
+		children: [
+			e && /* @__PURE__ */ R("div", {
+				className: "component-semi-strong-500 flex shrink-0 items-center gap-2.5",
+				children: [/* @__PURE__ */ L("span", { className: "from-brand-blue to-brand-purple size-2.5 shrink-0 rounded-full bg-linear-to-r" }), e]
+			}),
+			/* @__PURE__ */ L("span", {
+				className: "component-light-500 [&_a]:underline [&>p]:inline",
+				children: i
+			}),
+			n && /* @__PURE__ */ L(td, {
+				as: r,
+				href: n.href,
 				variant: "secondary-on-dark",
 				size: "medium",
 				density: "compact",
 				className: "shrink-0",
-				...i.extraAttrs,
-				children: i.label
-			})]
-		})]
+				...n.extraAttrs,
+				children: n.label
+			})
+		]
 	})
 }), MEe = ({ title: e, visualElement: t, largeVisualAsset: n, widget: r, widgetLabel: i, background: a = "neutral-50", bgColor: o, ...s }) => /* @__PURE__ */ L(h7, {
 	as: "div",

package/package.json

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