sunpeak 0.16.28 → 0.16.29

package/dist/{simulator-BYIH-xqQ.cjs → simulator-DIVvI69i.cjs}

@@ -173,21 +173,15 @@ function Conversation({ children, screenWidth, displayMode, platform, onRequestD
 				style: { maxWidth: containerWidth },
 				children: [
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						className: "z-10 grid h-[3.25rem] grid-cols-[1fr_auto_1fr] border-b px-2 pointer-events-auto",
-						style: {
-							borderColor: "var(--color-border-primary)",
-							backgroundColor: "var(--sim-bg-conversation, var(--color-background-primary))"
-						},
+						className: "z-20 flex h-[3.25rem] items-center justify-between p-2 pointer-events-auto",
+						style: { backgroundColor: "var(--sim-bg-conversation, var(--color-background-primary))" },
 						children: [
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: "flex items-center justify-start gap-3",
-								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-									onClick: handleClose,
-									"aria-label": "Close",
-									className: "h-7 w-7 flex items-center justify-center rounded-md transition-colors hover:opacity-70",
-									type: "button",
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CloseIcon$1, {})
-								})
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								onClick: handleClose,
+								"aria-label": "Close",
+								className: "h-7 w-7 flex items-center justify-center rounded-lg transition-colors hover:opacity-70",
+								type: "button",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CloseIcon$1, {})
 							}),
 							isDesktop && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 								className: "flex items-center justify-center text-base",
@@ -204,8 +198,7 @@ function Conversation({ children, screenWidth, displayMode, platform, onRequestD
 							style: {
 								maskImage: "linear-gradient(to bottom, transparent 0%, black 50%)",
 								WebkitMaskImage: "linear-gradient(to bottom, transparent 0%, black 50%)",
-								backdropFilter: "blur(16px)",
-								WebkitBackdropFilter: "blur(16px)"
+								backgroundColor: "var(--sim-bg-conversation, var(--color-background-primary))"
 							}
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							className: "max-w-[40rem] min-[1440px]:max-w-[48rem] mx-auto px-4 pt-4 pb-4 pointer-events-auto",
@@ -216,11 +209,12 @@ function Conversation({ children, screenWidth, displayMode, platform, onRequestD
 									name: "userInput",
 									disabled: true,
 									placeholder: "Message sunpeak.ai",
-									className: "w-full rounded-3xl px-5 py-3 pr-12 shadow-sm",
+									className: "w-full rounded-[28px] p-2.5 shadow-sm",
 									style: {
 										backgroundColor: "var(--sim-bg-reply-input, var(--color-background-secondary))",
 										color: "var(--color-text-primary)",
-										border: "1px solid var(--color-border-tertiary)"
+										border: "none",
+										cornerShape: "superellipse"
 									}
 								})
 							})
@@ -261,8 +255,11 @@ function Conversation({ children, screenWidth, displayMode, platform, onRequestD
 											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 												className: "flex w-full flex-col gap-1 empty:hidden items-end",
 												children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-													className: "relative rounded-[18px] px-4 py-3 max-w-[70%]",
-													style: { backgroundColor: "var(--sim-bg-user-bubble, var(--color-background-tertiary))" },
+													className: "relative rounded-[22px] px-4 py-2.5 leading-6 max-w-[70%]",
+													style: {
+														backgroundColor: "var(--sim-bg-user-bubble, var(--color-background-tertiary))",
+														cornerShape: "superellipse"
+													},
 													children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 														className: "whitespace-pre-wrap",
 														children: userMessage
@@ -313,17 +310,17 @@ function Conversation({ children, screenWidth, displayMode, platform, onRequestD
 													ref: setContentRef,
 													className: isPip ? "no-scrollbar @w-xl/main:top-4 fixed start-4 end-4 top-12 z-50 mx-auto max-w-[40rem] lg:max-w-[48rem] sm:start-0 sm:end-0 sm:top-[3.25rem] sm:w-full overflow-visible" : isFullscreen ? "no-scrollbar fixed inset-x-0 top-[3.25rem] bottom-0 z-50 mx-auto" : "no-scrollbar relative mb-2 @w-sm/main:w-full mx-0 max-sm:-mx-[1rem] max-sm:w-[100cqw] max-sm:overflow-hidden overflow-visible",
 													style: {
-														...isPip ? { maxHeight: "480px" } : {},
+														...isPip ? { maxHeight: "calc(50dvh - 38px)" } : {},
 														...isFullscreen ? { maxWidth: containerWidth } : {}
 													},
 													children: [isPip && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 														onClick: handleClose,
-														className: "absolute -start-2 -top-1.5 z-10 rounded-full bg-[#3a3a3a] p-1.5 text-white shadow-[0px_0px_0px_1px_#fff3,0px_4px_12px_rgba(0,0,0,0.12)] hover:bg-[#6a6a6a]",
+														className: "absolute -start-2 md:-start-6 -top-1.5 z-10 rounded-full bg-[#3a3a3a] p-1.25 text-white shadow-[0px_0px_0px_1px_var(--color-border-primary),0px_4px_12px_rgba(0,0,0,0.12)] hover:bg-[#6a6a6a]",
 														"aria-label": "Close picture-in-picture",
 														type: "button",
 														children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CloseIcon$1, { className: "h-4 w-4" })
 													}, "pip-close"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-														className: isPip ? "relative overflow-hidden h-full rounded-2xl sm:rounded-3xl shadow-[0px_0px_0px_1px_#fff3,0px_6px_20px_rgba(0,0,0,0.1)] md:-mx-4" : "relative overflow-hidden h-full",
+														className: isPip ? "relative overflow-hidden h-full rounded-2xl sm:rounded-3xl shadow-[0px_0px_0px_1px_var(--color-border-primary),0px_6px_20px_rgba(0,0,0,0.1)] md:-mx-4" : "relative overflow-hidden h-full",
 														children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 															className: "h-full w-full max-w-full",
 															style: { ...isPip ? {
@@ -350,8 +347,7 @@ function Conversation({ children, screenWidth, displayMode, platform, onRequestD
 								style: {
 									maskImage: "linear-gradient(to bottom, transparent 0%, black 50%)",
 									WebkitMaskImage: "linear-gradient(to bottom, transparent 0%, black 50%)",
-									backdropFilter: "blur(16px)",
-									WebkitBackdropFilter: "blur(16px)"
+									backgroundColor: "var(--sim-bg-conversation, var(--color-background-primary))"
 								}
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 								className: "max-w-[40rem] min-[1440px]:max-w-[48rem] mx-auto px-4 pt-4 pb-4 pointer-events-auto",
@@ -418,7 +414,7 @@ registerHostShell({
 		"--sim-bg-sidebar": "light-dark(#ffffff, #212121)",
 		"--sim-bg-conversation": "light-dark(#ffffff, #212121)",
 		"--sim-bg-user-bubble": "light-dark(rgba(233,233,233,0.5), rgba(50,50,50,0.85))",
-		"--sim-bg-reply-input": "light-dark(#ffffff, #212121)"
+		"--sim-bg-reply-input": "light-dark(#ffffff, #303030)"
 	}
 });
 //#endregion
@@ -2305,10 +2301,13 @@ function useSimulatorState({ simulations, defaultHost = "chatgpt" }) {
 			height: typeof window !== "undefined" ? window.innerHeight - 52 : 800,
 			width: measuredContentWidth ?? (typeof window !== "undefined" ? window.innerWidth : 1280)
 		};
-		if (displayMode === "pip") return {
-			height: 480,
-			...measuredContentWidth != null ? { maxWidth: measuredContentWidth } : {}
-		};
+		if (displayMode === "pip") {
+			const viewportH = typeof window !== "undefined" ? window.innerHeight : 800;
+			return {
+				maxHeight: Math.round(viewportH * .5 - 38),
+				...measuredContentWidth != null ? { maxWidth: measuredContentWidth } : {}
+			};
+		}
 		if (measuredContentWidth != null) return { maxWidth: measuredContentWidth };
 	}, [
 		containerHeight,
@@ -2524,7 +2523,7 @@ var useThemeContext = () => {
 };
 //#endregion
 //#region src/simulator/simple-sidebar.tsx
-var DEFAULT_SIDEBAR_WIDTH = 224;
+var DEFAULT_SIDEBAR_WIDTH = 260;
 function ChevronRightIcon() {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
 		width: "1em",
@@ -3698,4 +3697,4 @@ Object.defineProperty(exports, "useThemeContext", {
 	}
 });
 
-//# sourceMappingURL=simulator-BYIH-xqQ.cjs.map
+//# sourceMappingURL=simulator-DIVvI69i.cjs.map